我有 4 个 block ,每当我按下其中一个 block 时,其中就会出现一个复选框。如果我单击另一个 block ,当前复选框将消失,另一个复选框将出现,这很好。问题是,如果我单击一个 block 并出现该复选框,那么当我按下该复选框时,该 block 将消失,但它不应该消失。
我有以下 html 代码:
<div class="item">1 <input class="hidden" type="checkbox"></div>
<div class="item">2 <input class="hidden" type="checkbox"></div>
<div class="item">3 <input class="hidden" type="checkbox"></div>
<div class="item">4 <input class="hidden" type="checkbox"></div>
以下 CSS 代码:
.hidden {
display: none;
}
和 JavaScript 代码:
$(".item").click(function(){
$(".item").find('input').hide();
$(this).find('input').show('fast');
});
如何隐藏除当前复选框(我单击的 block )之外的所有可见复选框?
最佳答案
像这样使用.not()
过滤器
$(".item").click(function(){
$(".item").not(this).find('input').hide();
});
编辑:
您可能需要考虑用户是否想要改变主意并重新启用所有选项。你可以这样做:
$(".item").click(function(){
var items = $(".item").not(this).find('input');
if($('input',this).is(':checked')) items.hide();
else items.show();
});
关于javascript - JQuery隐藏除当前元素之外的所有元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19932499/