页面复选框全选

最新推荐文章于 2023-06-27 21:22:39 发布

jieliguge

最新推荐文章于 2023-06-27 21:22:39 发布

阅读量644

点赞数

分类专栏： jQuery

本文链接：https://blog.youkuaiyun.com/jieliguge/article/details/79195999

版权

jQuery 专栏收录该内容

2 篇文章

订阅专栏

用js做
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>jQuery实现CheckBox全选、全不选</title>
<script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript"></script> <script type="text/javascript">
$(function() {
$("#checkAll").click(function() {
$('input[name="subBox"]').attr("checked",this.checked);
});

$("input[name='subBox']").click(function(){
$("#checkAll").attr("checked", $("input[name='subBox']").length == $("input[name='subBox']:checked").length ? true : false);
});
});
</script>

</head>
<body>
<div>
<input id="checkAll" type="checkbox" />全选
<input name="subBox" type="checkbox" />项1
<input name="subBox" type="checkbox" />项2
<input name="subBox" type="checkbox" />项3
<input name="subBox" type="checkbox" />项4
</div>
</body>
</html>

用jquery

//获取选中选项的值
$("#getValue").click(function(){
var valArr = new Array;
$("#list :checkbox[checked]").each(function(i){
valArr[i] = $(this).val();
});
var vals = valArr.join(',');
alert(vals);
});
});