Question

我想根据Div ID和Checkbox Class检查所有复选框。不同div中的所有复选框都具有相同的类。我想检查该特定div中按钮单击的所有复选框。我不想像下面那样使用输入[type ='checkbox']。我只想使用Class Name。我可以这样做吗？

 $('div#'+Id+' input[type=checkbox]').each(function () {            
        $(this).prop('checked', true);
    });

以下是我的代码。

<div id="div1">
<input type="button" id="btnDiv1" value="Select All" />
<input type="checkbox" class="check" />Mark
<input type="checkbox" class="check" />Frank
</div>

<div id="div2">
<input type="button" id="btnDiv2" value="Select All" />
<input type="checkbox" class="check" />John
<input type="checkbox" class="check" />Travis
<input type="checkbox" class="check" /> Matt
</div>

<div id="div3">
<input type="button" id="btnDiv3" value="Select All" />
<input type="checkbox" class="check" />Lee
<input type="checkbox" class="check" />Charles
</div>

Answer 1

直接致电＆＃39; prop（）＆＃39;您的类选择器的方法如下：

$('div#'+Id+' input.check').prop('checked', true);

编辑：

$('input[type=button]').click(function() {
   $(this).parent().find('.check').prop('checked', true);
});

Answer 2

您可以这样做：

$('div').on('click',function(){
   $(this).find('input:not([type=button])').prop('checked',true);
});

DEMO

Answer 3

如果要在单击“全选”按钮时选择组中的所有复选框元素，可以为“全选”元素指定一个公共类名，然后附加click事件侦听器。 / p>

您可以使用.nextAll()选择所有后续的.check元素：

Example Here

$('.select-all').on('click', function () {
    $(this).nextAll('.check').prop('checked', true);
});

..或者您可以选择最接近的div祖先，然后选择其中的所有.check元素：

Example Here

$('.select-all').on('click', function () {
    $(this).closest('div').find('.check').prop('checked', true);
});

如果您想根据点击的“全选”按钮id中的数字选择元素，您可以使用以下内容：

Example Here

$('.select-all').on('click', function () {
    $('#div' + this.id.replace(/\D/g, '') +' .check').prop('checked', true);
});

使用Jquery根据Div Id和Class检查所有复选框

3 个答案: