Question

我想在点击当前图像时更改图像。

例如，对于展开和折叠过程，我想将加号（+）按钮更改为减号（ - ），反之亦然。

请帮我编码。我想用javascript做。

Answer 1

尝试：

function changeImage() {

    if  (document.getElementById("changer").src == "imgs/plus.png")
    {
        document.getElementById("changer").src = "imgs/minus.png";
    }
    else 
    {
        document.getElementById("changer").src = "imgs/plus.png";
    }

}

这里有源代码

<img  src="imgs/plus.png" id="changer" onclick="changeImage(this)"/></a>

Answer 2

HI现在尝试这种方式

现在尝试 class并定义您的class background image ，就像这样

$(document).ready(function(){
	$('.imgChange').on('click', function(){
    	$(this).toggleClass('up');
    });		

});

.imgChange{
display:inline-block;
  vertical-align:top;
  width:79px;
  height:79px;
    cursor:pointer;
  background:url('http://salesmomsnetwork.com/wp-content/uploads/2010/09/PlusMinus.gif') no-repeat -67px -15px;
}

.imgChange.up{
background:url('http://salesmomsnetwork.com/wp-content/uploads/2010/09/PlusMinus.gif') no-repeat -67px -122px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<div class="imgChange up"></div>

在javascript中单击更改图像

2 个答案: