隐藏除一个以外的所有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(); 
}); 

Answer 2

添加你要隐藏你的选择的元素，在这种情况下，“包装”元素中的“格”元素。另外，修正了选择器的其他一些格式。

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