隐藏除一个以外的所有div
我想隐藏除一个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();
});
});
解决方案
更改
$('#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();
});
相关文章