0

我想用我的图像制作单选按钮。所以我这样定义我的div：

<div id="LabBox">
    <img class="dlike" alt="dlike" src="images/dlike_OFF.png"/>
    <img class="check" alt="check" src="images/check_OFF.png"/>
    <img class="funny" alt="funny" src="images/funny_OFF.png"/>
    <img class="idea" alt="idea" src="images/idea_OFF.png"/>
    <img class="imp" alt="imp" src="images/imp_OFF.png"/>

</div>

我想切换文件名。所以我使用以下 jqueqy 代码：

  $("#LabBox img").click(function () {

var src;    
var srcname = $(this).attr("src");


    // turn on!
if(srcname.toLowerCase().indexOf("off") >= 0){

    //(e.g images/dlike_OFF.png -> images/dlike_ON.png)
src = $(this).attr("src").replace("OFF", "ON");  
    $(this).attr("src", src);   
}   
    // All others turn off! for other words src swap.
  var src2 =$(this).siblings().attr("src").replace("ON", "OFF");
   // All images are the same pic. why?? ---> src="images/dlike_OFF.png"
  console.log(src2);
  $("#LabBox img").attr("src",src2);

    });

问题是当我想替换我选择的标签（图像）的所有“兄弟”时。所有 img 都更改为相同的 img，即“images/dlike_OFF.png”（第一个）。我如何使用兄弟姐妹（）更改我的所有 img？或者我如何调整我的脚本以交换所有图像？

4

2 回答 2

1 
$("#LabBox img").click(function () {
    if (this.src.indexOf('OFF') != -1) {
        this.src = this.src.replace('OFF', 'ON');
    }
    $(this).siblings().attr('src', function(i,src) {
        return src.replace('ON', 'OFF')
    });
});
于 2013-04-02T21:53:35.977 回答
1

LIVE DEMO

$("#labBox").on('click','img[src$=OFF]',function () {
  this.src = this.src.replace('OFF', 'ON');
  $(this).siblings().each(function(){
     this.src = this.src.replace('ON', 'OFF');
  });
});
于 2013-04-02T22:01:26.230 回答