jquery - nextAll() 是否可以只选择一定数量的元素而不是后面的所有元素？

Question

我想创建一个自己的下拉列表。

<dl>
<dt>Option 1</dt>
<dd><a href="#" /></dd>//a
<dd><a href="#" /></dd>//b
<dd><a href="#" /></dd>//c
<dt>Option 2</dt>
<dd><a href="#" /></dd>//1
<dd><a href="#" /></dd>//2
<dd><a href="#" /></dd>//3
</dl>

我的jQuery：

<script>
$('dd').hide();
$(document).ready(function(){
$('dt').bind('click', function(){
$(this).toggleClass('open').nextAll('dd').slideToggle(2000);
});
});
</script>

我想要的是，当用户单击选项 1 (dt) 时，只显示 a、b 和 c。单击选项 2 (dt)，仅显示 1、2 和 3。目前正在发生的事情是所有 dd 都被揭示（a、b、c 和 1、2、3）。我从 nextAll() 中删除了所有内容，只显示了 a 和 1。有没有办法只显示 dt 后面的信息而不显示所有 dd？

Answer 1

您可以使用nextUntil()匹配所有以下兄弟元素，直到下一个<dt>：

$("dt").on("click", function() {
    $(this).toggleClass("open").nextUntil("dt").slideToggle(2000);
});