jquery - 选择所有复选框 - 收集值

Question

我有一个容器，里面有复选框。我在容器外有一个全选复选框。

<tr>
<td width="33%">Category <br> <input type="checkbox" id="all_cat" name="catChkBox" class="ckbox"/> Select All/ Unselect All  </td>
</tr>
    <tr>
    <td width="50%" valign="top" id="catTd">
                                        <div class="container" id="categoryContainer"></div>
                                    </td>
    </tr>

使用 DWR 调用，我在容器内获得要填充的复选框值。

... function(data.... // data has got the values to be displayed in container with checkboxes
for(var i=0; i<data.length; i++)
{
$('#catContainer').append('<input type="checkbox" data-name="' + data[i].id + '" name="catChkBox" class="ckbox" id = "' + data[i].id + '" value="' + data[i].id + '" /> ' + data[i].name + '<br/>');
list = data[i].name;
catSL.push(data[i].id);
}
categories = $("input[name=catChkBox]:checked").map(function () {
return $(this).data('name');
}).get();
}, errorHandler:function(){
},async:false
});

我现在想选择所有选项。当我单击容器外的全选复选框时，它应该选择容器内的复选框。同样取消全选。我尝试了下面的代码，但它不起作用。

$('#all_cat').click( function(){
    for(var i=0; i<categoryData.length; i++)  //categoryData is the data which i get from dwr call
    {
    $(categoryData[i].id ).prop('checked', isChecked('all_cat'));
    }
    });
function isChecked(checkboxId) {
    var id = '#' + checkboxId;
    return $(id).is(":checked");
}

有什么帮助吗？？？？？？

Answer 1

这会将容器 div 内的所有复选框设置为与复选框相同的选中状态#all_cat：

$('#all_cat').click(function(){ 
    $('#categoryContainer input:checkbox').prop('checked', $(this).is(':checked'));
});

Answer 2

您可以只使用适当的 jQuery 选择器来选择容器内的所有复选框并checked立即设置属性：

$('#all_cat').click(function() {
    $('#catContainer input.ckbox').prop('checked', $(this).is(':checked'));
});