Javascript 使用href onClick选择所有HTML复选框

我正在尝试在

href

上设置

onClick

，它可以选择所有复选框，但是我的代码可以选择所有复选框，但是如果我再次单击按钮，如何取消选中复选框？请告知

HTML

---

许多jQuery方法，包括

.attr（）

和

.prop（）

，允许您传递回调函数而不是要设置的值。回调函数接收正在更改的属性的当前值，并应返回新值。通过这种方式，您可以为要更新的集合中的每个元素设置不同的值，具体取决于它们各自的起始值

请注意，通常，在更新

checked

属性时，最好使用

.prop（）

而不是

.attr（）

因此：

$（文档）.ready（函数（）{
$（'#selectAll'）。单击（函数（e）{
e、 预防默认值（）；
$（“输入：复选框”）.prop（'checked'，函数（i，current）{return！current；}）；
});
});
使用道具而不是属性。试试这样：

$(document).ready(function() {
  $('#selectAll').click(function() {
      var $checkbox = $('input:checkbox');
      $checkbox.prop('checked', !$checkbox.prop('checked'));
  });
});

您应该使用prop而不是attr。看

$（输入[type=checkbox]）.prop（'checked'，true）

根据您试图实现的目标，您需要跟踪复选框的当前状态


第一个链接
#selectAll
只是将当前状态的全局
变量保持选中状态，然后将其更改为相反的状态，并相应地更新所有复选框

第二个链接
#selectAll2
跟踪选中了多少复选框如果全部选中，则假设您要取消选中，如果至少选中一个复选框，则目的是全部选中。Else作为第一个示例


因此，这可能取决于您的意图/用户体验

请参见此示例：


$（文档）.ready（函数（）{
var检查=假；
$（'#selectAll'）。单击（函数（）{
选中=！选中；
$（“输入[类型=复选框]”）.prop（'checked'，checked）；
});
var numChecks=$（“输入[type=checkbox]”）。长度；
var checked2=假；
$（'#selectAll2'）。单击（函数（）{
var chked=$（“输入[类型=复选框]：选中”）.length；
var allChecked=chked==numChecks；
var anyChecked=chked>0；
如果（全部选中）{
checked2=假；
}else if（anyChecked）{
checked2=真；
}否则{
checked2=！checked2；
}
$（“输入[类型=复选框]”）.prop（'checked'，checked2）；
});
});

hi your code当我只单击“仅选择特定”复选框而不选择“全部”时，我忽略了回调函数中的一个参数。修正。嗨，工作完美谢谢你完美的解决方案，让我开心：）+1这和OP的代码不一样吗？问题是显示的代码是有效的，但问题是如何再次点击锚并取消选中复选框。是的，我错过了阅读问题。我已经更新了代码片段。谢谢
$(document).ready(function() {
    $('#selectAll').click(function() {
        $("input:checkbox").attr('checked', true);
    });
});

$(document).ready(function() {
  $('#selectAll').click(function() {
      var $checkbox = $('input:checkbox');
      $checkbox.prop('checked', !$checkbox.prop('checked'));
  });
});