선택한 div에 클래스 추가 (div가 고유하지 않음)

Question

다른 divs에는 id="item"이 있습니다. divs 중 하나를 선택할 때 div가 선택된 a에 새 클래스가 추가되어야합니다. ID가 고유하지 않은 경우이를 수행 할 수있는 방법이 있습니까?

HTML : (I 시도했지만 작동하지 않는 것)

<div class="something" id="item"> 
    <a href="#" class="something">...</a> 
</div> 
<div class="something" id="item"> 
    <a href="#" class="something">...</a> 
</div> 
<div class="something" id="item"> 
    <a href="#" class="something">...</a> 
</div> 
<div class="something" id="item"> 
    <a href="#" class="something">...</a> 
</div> 

자바 스크립트 :

// changes all links on the website 
$("body").delegate('#item', 'click', function() { 
    $("a").addClass("active"); 
}); 

편집 : PHP와 모든 div의를 만들 수 있기 때문에이 delegate 기능을 사용하고, 그렇지 않으면 click 이벤트가 등록되지 않습니다.

Answer 1

고유하지 않은 ID는 절대 사용하지 마십시오. 유효하지 않습니다. 잘못된 ID는 제쳐두고, 특정 링크가 아닌 모든 링크를 대상으로 한 $("a")을 사용했기 때문에 작동하지 않습니다.

는 HTML : - (이 delegate

Answer 2

$로 돌아갈 경우

<div class="something" id="item1"> 
    <a href="#" class="something">...</a> 
</div> 
<div class="something" id="item2"> 
    <a href="#" class="something">...</a> 
</div> 
<div class="something" id="item3"> 
    <a href="#" class="something">...</a> 
</div> 
<div class="something" id="item4"> 
    <a href="#" class="something">...</a> 
</div> 

JS

// I doubt your actual site uses something in both cases, 
// but I made this more explicit. 
$("body").on('div.something', 'click', function() { 

    $('.active').removeClass('active'); 

    // Use this to add active to div 
    $(this).addClass("active"); 

    // Use this to add active to link 
    $(this).find('a').addClass('active"); 

}); 

또한 당신이 jQuery를 최신 버전을 사용하는 가정 on에 delegate을 변경주의) .find ("a"). addClass ("active");

Answer 3

이 작업을 시도해야합니다 :

<div class="something" id="item1"> 
    <a href="#" class="otherthing">...</a> 
</div> 
<div class="something" id="item2"> 
    <a href="#" class="otherthing">...</a> 
</div> 
<div class="something" id="item3"> 
    <a href="#" class="otherthing">...</a> 
</div> 
<div class="something" id="item4"> 
    <a href="#" class="otherthing">...</a> 
</div> 



$(".something").on('click', '.otherthing', function() { 
    $(this).addClass("active"); 
});