jquery - jquery：检查所有/无复选框仅有效一次

Question

我正在检查全部/无复选框。但是，它只能工作一次：它可以检查所有，然后取消所有检查，但不能再次检查它们。

http://jsfiddle.net/SDEwB/

check all/none: <input type = "checkbox" id = "check_all_none"></input>
<br/>
<input type = "checkbox" class = "others"></input><br/>
<input type = "checkbox" class = "others"></input>


$('#check_all_none').change(function () {
    if ( $(this).is(':checked') ){
        $('.others').attr("checked", true);
    }
    else{
        $('.others').removeAttr("checked"); 
       // $('.others').attr("checked", false); // tried this, too
    }
});

Answer 1

利用

$('#check_all_none').change(function () {
    $('.others').prop("checked", this.checked);
});

演示：小提琴

Answer 2

尝试这个

 $('#check_all_none').click(function () {
if ( $(this).is(':checked') ){
    $('.others').prop("checked", true);
}
else{
    $('.others').removeAttr("checked");
 }

});

演示

Answer 3

使用prop而不是 attr。

if ( $(this).is(':checked') ){
    $('.others').prop("checked", true);
}
else{
    $('.others').prop("checked", false);
}

http://jsfiddle.net/SDEwB/3/

更新：

就像阿伦说的，这更好：

$('#check_all_none').change(function () {
    $('.others').prop("checked", this.checked);
});

Answer 4

<input type = "checkbox" id = "check_all_none" onclick="checkAll(this)" />
<input type = "checkbox" class = "others" name="chk" /><br/>
<input type = "checkbox" class = "others" name="chk" /> 

查询：

function checkAll(t){
    if ( $(t).is(':checked') ){
        $('.others').prop("checked", true);
    }
    else{
        $('.others').attr('checked', false);
    }   
}

JavaScript：

function checkAll(t){
   var checkboxes= document.getElementsByName('chk');
    for (var i = 0; i < checkboxes.length; i++) {
        if(t.checked==true){
            checkboxes[i].checked = true;
        }else{
            checkboxes[i].checked = false;
        }
    }
}

我有声明功能。因为您可以在任何地方轻松地重用此代码。我编写了两种类型的代码（JQuery 和 JavaScript）。两者都工作正常。如果您不需要使用任何 jQuery 库，请使用 JavaScript 代码。

Answer 5

这里有一个简单的方法来检查所有想要的复选框：

$("#check_all_none").click(function() {
    $(".others").attr('checked', this.checked);
});

演示