Question

jQuery的：

$("#star_btn1").click(function() {
$('#ca').toggle();
// I would like to hide everything EXCEPT CA under parent wrapper .allthestates 

});

HTML：

<div class="allthestates">

<!-- there are div ids here with every 50 states, all states are display none in css by default, the problem is the JS -->

<div id="ca">content</div>

</div>

所以点击#star_btn1按钮，然后在#ca下显示身份.allthestates - 其他所有内容都不会显示。

Answer 1

尝试＆＃34;：not（）＆＃34;选择器和＆＃34;＆gt;＆＃34; （直系孩子），你可以做这样的事情：

$("#star_btn1").click(function() {
    $('.allthestates > :not(#ca)').hide();
    $('#ca').show();
});

<div class="allthestates">
   <div class="state" id="CA">California</div>
   <div class="state" id="TX">Texas</div>
</div>

Answer 2

JQuery有＆＃34; not＆＃34;您可以调用的函数来排除您希望的任何元素。

$("#star_btn1").click(function() {
$('.allthestates').children().not('#ca').toggle();
// I would like to hide everything EXCEPT CA under parent wrapper .allthestates 

});

Answer 3

看看这里：http://www.w3schools.com/jquery/sel_not.asp

$(".allthestates:not(.allthestates #ca)").hide();

在Vohuman的帮助下，我们得出了更好的结果：

$(".allthestates > :not(#ca)").hide();

＆＃34;＆gt;＆＃34; selector从第一个选择器中获取所有直接子项，并从该集合中排除id为＃34; #ca＆＃34;。

Answer 4

试试这个

$("#star_btn1").click(function() {
    $('.allthestates').children().hide().filter('#ca').show();
});

切换一个元素并将其余元素隐藏在相同的包装类下

4 个答案: