jquery - 隐藏除一个之外的所有 div

Question

我想隐藏一个完整的 div 容器，除了一个 div。

因此，在启动时只显示 div id“box_5”并隐藏其余部分。 当我单击按钮 1 时显示所有内容，当我单击按钮 2 时再次隐藏所有内容。

问题是当我隐藏“包装器”div 时，它隐藏了包括 id=box_5 在内的所有内容。

我认为问题是 div 在包装器 div 中，但我不知道解决方法？

<button id="button_1">show</botton>
<button id="button_2">hide</botton>

<div id="wrapper">
<div id="box_1"></div>
<div id="box_2"></div>
<div id="box_3"></div>
<div id="box_4"></div>
<div id="box_5">always show this</div>
<div id="box_6"></div>
<div id="box_7"></div>
<div id="box_8"></div>
<div id="box_9"></div>
<div id="box_10"></div>
</div>




$(document).ready(function() {
    $('#wrapper').not(":eq(#box_5)").hide();
    $('id="button_1"').click(function() {
        $('#wrapper').show();
        $('id="button_2"').click(function() {
            $('#wrapper').not(":eq(#box_5)").hide();
        });

    });

Answer 1

改变

$('#wrapper').not(":eq(#box_5)").hide(); 

到

$('#wrapper').not("#box_5").hide();

注意:删除了 eq 选择器。 eq 选择器在索引上工作，在您的情况下，您不需要 eq 选择器，因为您知道 div 的 ID。

另外请更改您的处理函数，如下所示，

$('#button_1').click(function() {
    $('#wrapper').show();
});

$('#button_2').click(function() {
    $('#wrapper').not("#box_5").hide();
});