jquery checkgroup 一组checkbox的check逻辑封装
时间: 2023-08-18 20:08:06 浏览: 38
可以使用以下代码来封装一组 checkbox 的 check 逻辑:
```javascript
function checkGroup(checkboxName, checkAllCheckboxName) {
// 获取所有同名的 checkbox
var checkboxes = document.getElementsByName(checkboxName);
// 获取全选 checkbox
var checkAllCheckbox = document.getElementsByName(checkAllCheckboxName)[0];
// 遍历所有 checkbox,如果有一个未选中,则取消全选
for (var i = 0; i < checkboxes.length; i++) {
if (!checkboxes[i].checked) {
checkAllCheckbox.checked = false;
return;
}
}
// 如果所有 checkbox 都选中了,则选中全选 checkbox
checkAllCheckbox.checked = true;
}
```
使用时,只需要在每个 checkbox 的 `onchange` 事件中调用该函数即可:
```html
<input type="checkbox" name="group" onchange="checkGroup('group', 'checkAll')">
<input type="checkbox" name="group" onchange="checkGroup('group', 'checkAll')">
<input type="checkbox" name="group" onchange="checkGroup('group', 'checkAll')">
<input type="checkbox" name="group" onchange="checkGroup('group', 'checkAll')">
<input type="checkbox" name="checkAll" onchange="checkAll('group', 'checkAll')">
```
其中,`checkboxName` 参数为一组 checkbox 的 name 属性值,`checkAllCheckboxName` 参数为全选 checkbox 的 name 属性值。在每个 checkbox 的 `onchange` 事件中,传入对应的参数即可。