有一个更简单的方法

首先给你的复选框一个类示例'id_chk'

然后在复选框内，将控制'id_chk'复选框的状态put:

<输入类型='checkbox' onchange='js:jQuery(.id_chk)。道具(“检查”、j查询(this)、道具(“检查”)' />

就这些，希望这能有所帮助

我知道这是老问题，但这个问题有点模棱两可，因为toggle可能意味着每个复选框都应该切换其状态，无论它是什么。如果有3个选中，2个未选中，那么切换将使前3个未选中，最后2个选中。

为此，这里的解决方案都不起作用，因为它们使所有复选框具有相同的状态，而不是切换每个复选框的状态。对多个复选框执行$(':checkbox').prop('checked')将在所有.checked二进制属性之间返回逻辑与，即如果其中一个未选中，则返回值为false。

你需要使用.each()如果你想实际切换每个复选框的状态，而不是使它们都相等，例如。

   $(':checkbox').each(function () { this.checked = !this.checked; });

请注意，在处理程序中不需要$(this)，因为.checked属性存在于所有浏览器中。

在某些条件下，复选框应自行更新。尝试点击“#选择所有团队成员”，然后取消一些项目，并再次单击选择全部。你可以看到不一致。为了防止它，可以使用以下技巧:

  var checkBoxes = $('input[name=recipients\\[\\]]');
  $('#select-all-teammembers').click(function() {
    checkBoxes.prop("checked", !checkBoxes.prop("checked"));
    $(this).prop("checked", checkBoxes.is(':checked'));
  }); 

顺便说一下，所有DOM-object复选框都应该像上面描述的那样缓存。

一个更好的方法和用户体验

$('.checkall').on('click', function() {
   var $checks  = $('checks');
   var $ckall = $(this);

    $.each($checks, function(){
        $(this).prop("checked", $ckall.prop('checked'));
    });
});

$('checks').on('click', function(e){
   $('.checkall').prop('checked', false);
});

在我看来，建议正常变种的人是GigolNet Gigolashvili，但我想建议更漂亮的变种。检查它

$(document).on('click', '.fieldWrapper > label', function(event) {
    event.preventDefault()
    var n = $( event.target ).parent().find('input:checked').length
    var m = $( event.target ).parent().find('input').length
    x = n==m? false:true
    $( event.target ).parent().find('input').each(function (ind, el) {
        // $(el).attr('checked', 'checked');
        this.checked = x
    })
})

您还可以通过执行以下操作来切换复选框。目前使用引导切换复选框。

<link href='https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css' rel='stylesheet'>
<script src='https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js'></script>

<input type='checkbox' id='toggleScheduler' name='toggleScheduler' data-toggle='toggle'  data-on='Enabled'  data-off='Disabled'

$("#toggleScheduler").bootstrapToggle('on'); // enable toggle checkbox
$("#toggleScheduler").bootstrapToggle('off'); // disable toggle checkbox