用JQuery写一个全选矿
时间: 2023-12-09 16:05:19 浏览: 127
JQuery实现checkbox的全选取消全选
4星 · 用户满意度95%
好的,以下是一个用 JQuery 实现的全选/全不选的示例代码:
HTML 代码:
```html
<input type="checkbox" id="selectall">全选
<input type="checkbox" class="checkbox">选项1
<input type="checkbox" class="checkbox">选项2
<input type="checkbox" class="checkbox">选项3
```
JQuery 代码:
```javascript
$(document).ready(function() {
// 点击全选复选框时,选中所有的复选框
$("#selectall").click(function() {
$(".checkbox").prop("checked", $(this).prop("checked"));
});
// 点击其他复选框时,检查是否所有复选框都被选中,如果是则选中全选复选框,否则取消选中全选复选框
$(".checkbox").click(function() {
if ($(".checkbox").length == $(".checkbox:checked").length) {
$("#selectall").prop("checked", true);
} else {
$("#selectall").prop("checked", false);
}
});
});
```
这段代码会在页面加载完成后执行,当用户点击全选复选框时,会将所有的复选框选中,当用户点击其他复选框时,会检查是否所有复选框都被选中,如果是则选中全选复选框,否则取消选中全选复选框。
阅读全文