jQuery 隐藏除一个之外的所有 div
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13239331/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Hide all div's except one
提问by Bastiaan
I'd like to hide a complete div container except one div.
我想隐藏一个完整的 div 容器，除了一个 div。
So, on startup just show div id"box_5" and hide the rest. When i click button 1 show everything and when i click button 2 hide everything again.
因此，在启动时只显示 div id"box_5" 并隐藏其余部分。当我单击按钮 1 时显示所有内容，当我单击按钮 2 时再次隐藏所有内容。
The problem is when i hide the "wrapper" div it is hiding everything incl. id=box_5.
问题是当我隐藏“包装器”div 时，它隐藏了所有内容，包括。id=box_5。
I think the problem is the div is within the wrapper div but i don't know a work-around?
我认为问题是 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();
});
});
回答by Selvakumar Arumugam
Change
改变
$('#wrapper').not(":eq(#box_5)").hide();
to
到
$('#wrapper').not("#box_5").hide();
Note:Removed the eqselector. eqselector works on the index and in your case you don't need eqselector as you know the ID of the div.
注意：删除了eq选择器。eq选择器适用于索引，在您的情况下，您不需要eq选择器，因为您知道 div 的 ID。
Also please change your handler functions like below,
另外请更改您的处理程序功能，如下所示，
$('#button_1').click(function() {
$('#wrapper').show();
});
$('#button_2').click(function() {
$('#wrapper').not("#box_5").hide();
});
回答by Alex
Add the element you want to hide to your selector, in this case the "div" elements inside the "wrapper" element. Also, fixed some of the other formatting of the selectors.
将要隐藏的元素添加到选择器中，在本例中为“wrapper”元素内的“div”元素。此外，修复了选择器的一些其他格式。
$('#wrapper div').not("#box_5").hide();
$("#button_1").click(function() {
$('#wrapper div').show();
});
$("#button_2").click(function() {
$('#wrapper div').not("#box_5").hide();
});
