通过多个输入复选框的JQuery循环

我的任务是在多个div中有一个复选框。当复选框被选中时，我想隐藏div。我想用Jquery来实现这个功能。我觉得我很接近，但缺少一些必要的东西。通过多个输入复选框的JQuery循环

这是我的代码和任何帮助将不胜感激。

感谢，

ROKA

<div id='legGroup1' class="elementGroup"> 
    <input type="checkbox" class="delCheck" id="1" />Delete</label> 
</div> 

<div id='legGroup2' class="elementGroup"> 
    <input type="checkbox" class="delCheck" id="2" />Delete</label> 
</div> 

<button type='button' id='removeLeg'></button> 

$("#removeLeg").click(function (e) { 
    $('.delCheck').each(function() { 
     if (this.id.prop('checked')) { 
      $("#legGroup" + this.id).hide(); 
     } 
    }); 
});

来源

2016-05-12 Roka

你可以简单地查找父元素：

$("#removeLeg").click(function() { 
    $('.delCheck:checked').each(function() { 
    //   ^^^^^^^^ -> look it filters only checked elements 

     $(this).parent().hide(); 

    }); 
});

或者，更准确，使用最接近的方法：

$(this).closest('.elementGroup').hide();

来源

2016-05-12 16:06:46

由于你使用一个each函数，根据函数返回的数组中的项的值作为它的基础。

$("#removeLeg").click(function (e) {  
    $('.delCheck').each(function (key, value) { 
     if ($(value).is(':checked')) { 
      $(value).parent().hide(); 
     } 
    }); 
});

来源

2016-05-12 16:08:49 Josh

首先，您在HTML中缺少开放的label标记。

<label><input type="checkbox" class="delCheck" id="1" />Delete</label>

至于click事件，你可以试试这个，循环遍历每个复选框并隐藏它们最接近的div父项。

$(document).ready(function(){ 
    $('#removeLeg').on('click', function(){ 
     $('.delCheck:checked').each(function(){ 
      $(this).parents('div').hide(); 
     }); 
    }); 
});

这里有一个演示：https://jsfiddle.net/nx9e1yp5/1/

来源

2016-05-12 16:14:40

通过多个输入复选框的JQuery循环

回答

相关问题