-3

我正在尝试通过选择 selectAll 来分组复选框。请检查 JSFiddle 以获取代码示例

JSFiddle

  <fieldset>
    <!-- these will be affected by check all -->
    <div><input type="checkbox" ID="checkall1" onclick="CheckAllClick('checkall1');"> Check all</div>
    <div><input type="checkbox"> Checkbox</div>
    <div><input type="checkbox"> Checkbox</div>
    <div><input type="checkbox"> Checkbox</div>
</fieldset>
<fieldset>
    <!-- these won't be affected by check all; different field set -->
    <div><input type="checkbox" ID="checkall2" onclick="CheckAllClick('checkall2');"> Check all</div>
    <div><input type="checkbox"> Checkbox</div>
    <div><input type="checkbox"> Checkbox</div>
    <div><input type="checkbox"> Checkbox</div>
</fieldset>


   function CheckAllClick(id){
    alert(id);
     $(id).closest('fieldset').find(':checkbox').prop('checked', this.checked);

}

第 2 部分：继续

4

3 回答 3

0

你可能想要的是这个。

$('[id^=checkall]').click(function(){
    $(this).closest('fieldset').find(':checkbox').not(this).prop('checked', function(i,oldval){
       return !oldval; 
    });
});

小提琴

于 2013-07-09T01:28:52.370 回答
0

你的函数有一些问题：试试这个方法：

JS

   function CheckAllClick(elem) {
       $(elem).closest('fieldset').find(':checkbox').prop('checked', elem.checked);
   }

标记

 <input type="checkbox" ID="checkall1" onclick="CheckAllClick(this);">Check all</div>

小提琴

将 onclick 函数中的元素传递为this并在代码中访问它。

如果您可以使用 jquery 方法，那么：

将课程添加到您的选中复选框

 <input type="checkbox" class="checkAll" ID="checkall1" >Check all

使用相同的代码，如果您想让标签单击以选中复选框，那么只需将它们包装在label标签中，您可以通过将所有复选框包装在标签中来对它们做同样的事情，这通常是一种标准方式：

 <label><input type="checkbox" class="checkAll" ID="checkall1" >Check all<label>

将事件处理程序绑定到类

$('.checkAll').on('change', function(){
    $(this).closest('fieldset').find(':checkbox').prop('checked', this.checked);
})

小提琴

于 2013-07-09T01:32:29.330 回答
0 
function CheckAllClick(id){
    alert(id);
    $(id).closest('fieldset').find(':checkbox').prop('checked', 'checked');
}

最简单的解决方案是将已选中的属性更改为已选中，因为您只选择了您想要的输入

并将其传递给您的 onclick

<div><input type="checkbox" ID="checkall2" onclick="CheckAllClick(this);"> Check all</div>
于 2013-07-09T01:34:36.057 回答