匹配所有下一个元素

Question

HTML：

<div class="parent">
    <a href="#" class="target"></a>
    <div class="block">text</div>
    <div class="block">text</div>
</div>
<div class="parent">
    <a href="#" class="target"></a>
    <div class="block">text</div>
    <div class="block">text</div>
</div>

jQuery的：

$(".target").click(function() {
    $(this).next('.blocks').slideToggle( "fast" );
});

..有效，但只匹配一个（第一个）.block，而不是父元素中的所有块。

Answer 1

.next()方法获得匹配元素集中每个元素的紧随其后的兄弟。如果提供了选择器，则仅当它与该选择器匹配时，它才会检索下一个兄弟。

使用.siblings()或.nextAll()选择器：

$(this).siblings('.blocks').slideToggle( "fast" );

或

$(this).nextAll('.blocks').slideToggle( "fast" );