Question

是否可以通过javascript或jQuery向类的所有元素添加唯一的事件侦听器，以便在触发事件时仅触发该元素而不是所有具有相同类名的元素？

例如，如果我有以下HTML

<div class"clickable-box"><span style="display: none;">Hi There!</span></div>
<div class"clickable-box"><span style="display: none;">Peek-A-Boo!</span></div>
<div class"clickable-box"><span style="display: none;">Now You See Me!</span></div>

...以及以下jQuery

$('.clickable-box').click(function() {
    $('.clickable-box span').slideToggle('slow');
});

...上面将切换显示所有div的跨度。

有没有办法单独进行这些触发而不必为每个div使用唯一的id或类？

Answer 1

你需要

$('.clickable-box').click(function() {
    $(this).find('span').slideToggle('slow');
});

在div

中的=之后也遗漏了class

<div class="clickable-box"><span style="display: none;">Hi There!</span></div>
<div class="clickable-box"><span style="display: none;">Peek-A-Boo!</span></div>
<div class="clickable-box"><span style="display: none;">Now You See Me!</span></div>

演示：Fiddle

Answer 2

搜索范围时，您应指定context：

$('.clickable-box').click(function(){
    $('span', this).slideToggle('slow');
});

为类中的所有元素添加唯一的侦听器

2 个答案: