如何选择多个元素的siblings()？

Question

假设我有一个隐藏了所有<dd>的<dl>。单击<dt>将使用以下代码切换其后面的<dd>：

$(this).nextUntil('dt').toggle();

http://jsfiddle.net/mblase75/FZQj7/

现在，我想自动隐藏其他<dd>后面的<dt>，所以我尝试用下面的代码获取兄弟：

$(this).nextUntil('dt').toggle()
    .siblings().filter('dd').hide();

http://jsfiddle.net/mblase75/FZQj7/1/

但是什么也没有发生，因为我已经用.nextUntil选择的每个<dd>都是彼此的兄弟。因此，它们都是隐藏的，不会显示任何内容。

必须有一种简洁的方法来告诉jQuery选择除了我已经选择的兄弟项之外的所有兄弟项，但我看不到它。想法？

Answer 1

这个怎么样？注意not函数which you can read about here的使用。

http://jsfiddle.net/lbstr/FZQj7/6/

$('dt').on('click',function() {
    var $this = $(this),
        $firstGroup = $this.nextUntil('dt');
    $firstGroup.toggle();
    $this.siblings('dd').not($firstGroup).hide();
});​

Answer 2

一个简单的解决方案是将一个类应用于所显示的元素。每次单击时，您都可以在显示所需的集合之前隐藏包含此类的元素。

http://jsfiddle.net/FZQj7/11/

$('dt').on('click',function() {
    $('.visibledd').hide().removeClass('visibledd');
    $(this)
        .nextUntil('dt')
        .toggle()
        .addClass('visibledd');
});​

Answer 3

这里有一些比其他的更简单的东西：

$('dt').on('click',function() {
    $(this).siblings('dd').hide();
    $(this).nextUntil('dt').show();
});