复选框以切换所有选定内容

Question

我有这个javascript代码

    // Listen for click on toggle checkbox
$('#select-all').click(function(event) {   
    if(this.checked) {
        // Iterate each checkbox
        $(':checkbox').each(function() {
            this.checked = true;                        
        });
    }
});

我有这个

<form action="" method="POST">    
Toggle All : &nbsp;&nbsp;
<input type="checkbox" name="select-all" id="select-all" />

然后在我的桌子上有多个复选框

<input type="checkbox" name="checkbox-1" id="checkbox-1" value="1"> Select
<input type="checkbox" name="checkbox-2" id="checkbox-2" value="2"> Select
<input type="checkbox" name="checkbox-3" id="checkbox-3" value="3"> Select
<input type="checkbox" name="checkbox-4" id="checkbox-4" value="4"> Select

当我单击“全部切换”时，它不会选中复选框-1到复选框-4。

我的javascript代码出了什么问题。

谢谢！！我想实际执行一个函数，在表单提交时通过post发送所有checkbox1-4的值。

Answer 1

就这样做吧。

$('#select-all').click(function(event) {
    $(':checkbox').prop("checked", this.checked);
});

您不需要循环遍历每个复选框来检查所有。

Demo

如果脚本在head标记中，则将代码打包到dom中。

$(document).ready(function() {
    $('#select-all').click(function(event) {
        $(':checkbox').prop("checked", this.checked);
    });
});