javascript - 向选定的 div 添加类(div 不是唯一的)

Question

我有不同的 div，它们有一个 id="item"。当我选择其中一个 div 时，应将一个新类添加到已选择 div 的 a 中。当 ID 不唯一时，有什么办法可以做到这一点吗？

HTML:

<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>

JavaScript(我已经尝试过，但不起作用):

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

编辑:我正在使用 delegate 函数，因为我使用 PHP 创建所有 div，否则不会注册点击事件。

Answer 1

永远不要拥有非唯一 ID，那是无效的。除了无效的 ID，这不起作用，因为您使用的是针对所有链接而不是特定链接的 $("a")。

HTML:

<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，我将 delegate 更改为 on - 如果没有返回 delegate