javascript - 使用 JQuery 隐藏 sibling 和 parent 的 sibling 直到给定的 id

Question

由于单击按钮时出现空间问题，我正在尝试展开内部 div。当用户单击一个按钮时，我想隐藏它的 sibling 和 parent 的 sibling ，直到指定的 id。如何使用 jquery 在 javascript 中执行此操作？

示例如下:

Dom:

<div id="p">
    <div id="p1-1">
        <div id="c1-1-1">
            <button id="expand"></button>
        </div>
        <div id="c1-1-2">
        </div>
    </div>
    <div id="p1-2">
        <div id="c1-2-1">
        </div>
    </div>
    <div id="p1-3">
        <div id="c1-3-1">
        </div>
    </div>
</div>

结果 Dom:

<div id="p">
    <div id="p1-1">
        <div id="c1-1-1">
            <button id="expand"></button>
        </div>      
    </div>  
</div>

Answer 1

使用 parentsUntil() 查找您希望保持可见的元素, 使用 each() 遍历它们，然后隐藏他们的 sibling ()。

$(button).click(function(){
    var elementsToKeep = $(this).parentsUntil('#stop_element_id');
    elementsToKeep.each(function(){
        $(this).siblings().hide();
    });
});

没有足够的代表发布到 siblings() 的链接。