复选框切换所有选择

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代码出了什么问题。

谢谢！！ 我实际上想做一个函数，当在表单提交中选中它们时，将通过邮寄发送checkbox1-4的所有值。

Answer 1

只需这样做。

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

您无需遍历每个复选框即可全部选中。

演示版

如果您的脚本位于head标签中，则将代码包装在dom中

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