jQuery는 형제와 img를 교환합니다.

Question

내 이미지와 함께 라디오 버튼을 만들고 싶습니다. 그래서 내 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> 

나는 파일 이름을 토글하고 싶다. 난 내 선택 태그 (이미지)/dlike_OFF은 "이미지입니다 같은 IMG에 .ALL img와 변화의 모든"형제 "로 대체 할 때

$("#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); 

    }); 

문제가 : 그래서 나는 추적의 jqueqy 코드를 사용합니다. png "(첫번째 것). 형제()를 사용하여 모든 img를 어떻게 변경합니까? 아니면 모든 이미지를 바꾸기 위해 내 스크립트를 조정할 수 있습니까?

Answer 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') 
    }); 
}); 

Answer 2

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'); 
    }); 
});