jquery - 如何查找和替换里面的图片使用jQuery？

Question

我正在尝试检查图像并替换图像以进行展开和折叠<div> ，但我无法找到解决方案。

html代码：

<h4 id="expanderHead">Virtual Room <span id="expanderSign">+</span></h4>
<div id="expanderContent" style="display:none">
    content ... content...
</div>

jQuery：

$(document).ready(function(){
   $("#expanderHead").click(function(){
      $("#expanderContent").slideToggle();
      if ($("#expanderSign").text() == "+"){
          $("#expanderSign").html("-")
      }
      else {
          $("#expanderSign").text("+")
      }
    });
});

在这里，而不是+和-我必须放置<img src="" alt=""/>.

谢谢你。

Answer 1

HTML

<h4 id="expanderHead">Virtual Room <span id="expanderSign"><img src="plus-sign.png" /></span></h4>
<div id="expanderContent" style="display:none">
    content ... content...
</div>​

已编辑（添加了更好的 jQuery 版本）

jQuery 新版本

$(document).ready(function(){

   $("#expanderHead").click(function(){

       $("#expanderContent").slideToggle();

       var plusImg = "http://cdn2.iconfinder.com/data/icons/diagona/icon/16/129.png";
       var minusImg = "http://cdn2.iconfinder.com/data/icons/diagona/icon/16/130.png";        
       $this = $("#expanderSign img");            

       if( $this.attr('src') == plusImg ) { $this.attr('src', minusImg);} 
       else { $this.attr('src', plusImg); }

   });
});

观看现场演示

Answer 2

$(文档).ready(函数(){

       $("#expanderHead").click(function(){
      $("#expanderContent").slideToggle();
      if ($("#imgId").attr('src') == "d2.png"){
          $("#imgId").attr("src","d1.png")
      }
      别的 {
          $("#imgId").attr("src","d2.png")
      }
    });
});

    <h4 id="expanderHead">虚拟房间 <img id='imgId' src='d2.png' /></h4>
<div id="expanderContent" style="display:none">
    内容……内容……
</div>