forEach标签中checkbox复选框的全选,全不选,部分选,反选等基础操作

最新推荐文章于 2023-07-13 14:57:51 发布

开发仔小肥

最新推荐文章于 2023-07-13 14:57:51 发布

阅读量1.5k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： jsp 文章标签： jquery jsp checkbox 复选框全选

本文链接：https://blog.youkuaiyun.com/qq_42461639/article/details/80698488

jsp 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一种使用jQuery实现全选与反选功能的方法，适用于类似购物车的场景。通过监听全选按钮和各个复选框的状态变化，确保全选状态与所有子项的选择状态保持一致。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

此处是全选按钮

forEach循环里的选择按钮

$(function() {

//全选的改变事件

$("#selectAllBox").change(function() {
var flag = $(this).is(":checked");
if (flag) {
$(".selectBox").each(function() {
$(this).prop("checked", true);
});
} else {
$(".selectBox").each(function() {
$(this).removeAttr("checked", false);
});
}
});
$(".selectBox").change(function() {
$(".selectBox").each(function() {
if ($(this).is(":checked")) {
break;
} else {
$("#selectAllBox").removeAttr("checked", false);
}
});
var lengthSelected = $(".selectBox:checked").length;
var length = $(".selectBox").length;
if (lengthSelected == length) {
$("#selectAllBox").prop("checked", true);
}
});

});