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