jQuery如何根据子对象的选中状态隐藏父Div

我有以下近似HTML：

<div class="productDiv"><div class="someClass><div><input type="checkbox" class="product"/></div></div></div>
<div class="productDiv"><div class="someClass><div><input type="checkbox" class="product"/></div></div></div>
etc.

---

谢谢

选择所有选中的输入，然后在dom树上找到它们的父项：

$('.productDiv').hide();
$('.product:input:checked').parents('.productDiv').show();

---

创建更改事件，然后触发更改事件：

$(".product").change(function() {
    this.checked ? $(this).parents(".productDiv").show() : $(this).parents(".productDiv").hide();
}).change();

---

您可以使用以下jquery实现您想要的功能：

$('.productDiv').hide().filter(function() {
    return $(this).find('input.product:checked').length > 0;
}).show();

我建议您在操作中使用选择器。 就像这样：

$('.product').next().hide();
$('.product').change(function(){
    $(this).next().toggle();
});

---

这是完整的。

您的问题中缺少结束语。。请检查一下<代码>“productDiv”。将第二个

？

更改为

：

@MG_Bautista——固定，早上第一个答案，需要解决yetThanks。这也很有效，但与我最初的方法不太接近。

$('.product').next().hide();
$('.product').change(function(){
    $(this).next().toggle();
});

$('input:checkbox .product').each(function(){
    if(!($(this).is(':checked'))){
         $(this).closest('.productDiv').hide();
    }
});