jQuery：根据子元素的属性隐藏父元素

Question

jQuery：根据子元素的属性隐藏父元素

4

这是一个HTML页面（示例）

<!DOCTYPE html>
<html>
<body>

<div id="first">
<label>First</label>
<input type="checkbox" checked="checked">
</div>

<div id="second">
<label>Second</label>
<input type="checkbox">
</div>

</body>
</html>

它显示如下所示的两个复选框。

我想知道是否可以通过jQuery仅隐藏第二个复选框。

我正在处理的实际页面包含大约40个复选框，我希望解决方案也适用于这些复选框。

这可能吗？

有人可以告诉我如何做到这一点吗？

- VPY

1

隐藏复选框的条件是什么？ - brk

1

而取消隐藏复选框的条件是什么？ - traktor

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- guradio · Accepted Answer

使用:not()选择器与:checked一起使用，可以选择未选中的复选框。
使用closest获取父div，然后使用.hide()隐藏它。

$('.anchor:not(:checked)').closest('.container').hide();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="first" class='container'>
  <label>First</label>
  <input type="checkbox" checked="checked" class='anchor'>
</div>

<div id="second" class='container'>
  <label>Second</label>
  <input type="checkbox" class='anchor'>
</div>