Question

我需要选中一个复选框（checkAll）并选择全部，如果我取消选中，则也应该取消选中。此外，如果他们全部被选中，然后我取消选中'a'，'b'或'c'，'checkAll'也需要取消选中。

<input type="checkbox" value="" id="checkAll">
<input type="checkbox" value="a">
<input type="checkbox" value="b">
<input type="checkbox" value="c">

我需要使用什么触发器？试过但失败了：

$("#checkAll").click(function() {
    alert('test');
});

Answer 1

使用change事件。更改#checkAll框后，相应更改其他框。

要根据其他人更改#checkAll框，您可以执行以下操作：

$(":checkbox").not("#checkAll").change(function()
{
    $("#checkAll").attr("checked", $(":checkbox").not(":checked").not("#checkAll").length ? false : true);
});

基本上，当#checkAll以外的复选框发生变化时会执行此操作，并根据是否有未选中的复选框更改#checkAll。

Answer 2

执行您想要的简单脚本：

HTML：

<div>
    <input type="checkbox" value="" id="checkAll">
    <input type="checkbox" value="a" class="others">
    <input type="checkbox" value="b" class="others">
    <input type="checkbox" value="c" class="others">
</div>

的javascript：

<script type="text/javascript">
    $("#checkAll").change(function() {
        $(":checkbox").attr("checked", this.checked);
    });
    $(".others").change(function() {
        if (!$('input.others[type=checkbox]:not(:checked)').length)
            $("#checkAll").attr('checked', true);
        if (!$('input.others[type=checkbox]:checked').length)
            $("#checkAll").attr('checked', false);
    });
</script>

Answer 3

我没有更改任何代码，它对我有用：http://jsfiddle.net/9U2aQ/

确保您正确引用了jquery文件。

Answer 4

这应该有效：

    $(':checkbox').not('#checkAll').change(function()
    {
        $("#checkAll").attr("checked", $(":checkbox").not(":checked").not("#checkAll").length ? false : true);
    }); 
    $("#checkAll").change(function() 
    {
        $(':checkbox').attr('checked', this.checked);
    });

选中所有复选框，并使用jQuery进行一次检查

4 个答案: