如何清除所有复选框当复选框 is="check All" 被选中时？答案

【问题标题】：How to clear all checkbox When checkbox id="checkAll" are checked?如何清除所有复选框当复选框 is="check All" 被选中时？
【发布时间】：2014-11-06 21:30:33
【问题描述】：

当复选框id="checkAll"被选中时，如何清除所有复选框？

在我的演示中，当用户选中复选框 id="checkAll" 时，所有复选框都被选中

但我想申请，当用户选中复选框id="checkAll"时，所有复选框都清除了，我该怎么办？

http://jsfiddle.net/peap/sydzL8Lc/1/

$('#checkAll').click(function () {    
     $('input:checkbox').prop('checked', this.checked);       
 });

【问题讨论】：

小提琴似乎工作正常。它怎么不适合你？
当我检查 Check All 我想清除所有复选框
这对我来说似乎违反直觉。像现在这样更好。
clear 是什么意思？是uncheck吗？

标签： javascript jquery html checkbox

【解决方案1】：

您可以使用change() 函数，您可以在更改事件中使用this.checked 进行检查，它将返回boolean 复选框检查状态的值：

检查所有主要检查：

$('#checkAll').change(function () {    
   $('input:checkbox').prop('checked', this.checked); // all checked on check of #checkAll 
 });

Uncheck All on Main Checked:

$('#checkAll').change(function () {    
    $('input:checkbox').prop('checked', !this.checked);   // all unchecked on check of #checkAll
     });

如果您希望全部取消选中但没有主复选框，则：

取消选中除主要之外的所有：

$('#checkAll').change(function () {    
    $('input:checkbox').not(this).prop('checked', !this.checked);   // all unchecked on check of #checkAll but not itself
         });

【讨论】：

【解决方案2】：

您不应为多个元素使用相同的 ID，因为 ID 是唯一的。而是使用class="checkedItem"。

如果你想清除所有使用

$('#checkAll').click(function () {    
    $('input:checkbox').prop('checked', !this.checked);       
});

不过，这也会清除第一个复选框。为了防止这种使用

$('#checkAll').click(function () {    
    $('input:checkbox').not(this).prop('checked', !this.checked);       
});

【讨论】：

【解决方案3】：

只需应用this.checked的否定

$('#checkAll').change(function () {    
     $('input:checkbox').not(this).prop('checked', !this.checked);       
 });

Demo

【讨论】：

【解决方案4】：

如果我对您的理解正确，您希望在他们单击“全部检查”时清除所有项目 - 为了清楚起见，您可能需要将名称更改为“全部清除”。

如果是这样，只需添加一个简单的 !在this.checked的前面

$('#checkAll').click(function () {
$('input:checkbox').prop('checked', !this.checked); });

【讨论】：