点击javascript更改背景图片

时间:2013-03-10 14:30:51

标签: javascript css html

你好我有一些javascript的问题。我有一个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>

这是代码,但它忽略了我的背景图像更改。谁能帮我? 简短信息:我对javascript一无所知。

无论如何,谢谢你。

3 个答案:

答案 0 :(得分:3)

使用javascript时,你会这样做:

this.style.backgroundImage="url()";

请注意,javascript会改变语法,而不是使用backgroundImage的背景图像。

答案 1 :(得分:1)

为什么不使用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>

http://api.jquery.com/css/

答案 2 :(得分:0)

我希望你能在css中使用这样的东西:

#your_btn_id{
    width:200px;
    height:50px;
    background-image: url('../images/inactive.png');
}

点击后更改背景图片:

#your_btn_id:active{
    background-image: url('../images/active.png');
}

希望它能够正常使用,而且它的使用非常简单。