[英]On click javascript change background image
Hello i have a problem with some javascript. 您好,我有一些JavaScript问题。 I have a div to layout a button who does something(in my chase it will insert number 1 in to a box) and i want to change the background of the button when clicked: 我有一个div来布局执行某项操作的按钮(按我的追究,它将在框中插入数字1),并且我想在单击时更改按钮的背景:
<div id="nr1"><INPUT TYPE="button" NAME="one" OnClick="this.style = 'background-image:URL(images/totalback.gif);'; Calc.Input.value += '1'" style="width:45px; height:30px; background-color:transparent; border-style: none; border-width: 0px 0px 0px 0px"></div>
This is the code,but it ignores my background image change. 这是代码,但忽略了我的背景图像更改。 Can any one help me? 谁能帮我? Short info: i have little clue about javascript. 简短信息:我对javascript知之甚少。
Thank you anyway. 还是要谢谢你。
When using javascript you do it like this: 使用javascript时,您需要这样做:
this.style.backgroundImage="url()";
Note that javascript changes the syntax a bit, instead of background-image you use backgroundImage. 请注意,javascript会稍微更改语法,而不是使用backgroundImage来替换background-image。
Why dont you just use jquery its simple like this 你为什么不像这样简单地使用jquery
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$('#nr1 input').on("click", function(){
$(this).css({'background' : 'red'});
});
});
</script>
I hope you can use something like this in css: 我希望您可以在CSS中使用如下所示的内容:
#your_btn_id{
width:200px;
height:50px;
background-image: url('../images/inactive.png');
}
When clicked change the background image: 单击后,更改背景图像:
#your_btn_id:active{
background-image: url('../images/active.png');
}
Hope it will work and the thing is its very simple to use. 希望它会起作用,而且事情很简单。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.