功能需求：
①全选框：点击后让所有爱好的选中状态和自己一致
②爱好框：点满后将全选框选中，否则取消选中
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>全选全不选</title>
<script type="text/javascript" src="../../script/jquery-1.7.2.js"></script>
<script type="text/javascript">
$(function() {
//①全选框：点击后让所有爱好的选中状态和自己一致
$("#checkedAllBox").click(function(){ //定义点击事件
//获取当前全选框的选中状态（DOM）
var ck = this.checked;
//将该状态赋值给所有的爱好框
$("input[name='items']").attr("checked",ck); //设置name为items的选中框，设置跟全选框一样的属性
});
//②爱好框：点满后将全选框选中，否则取消全选框选中
$("input[name='items']").click(function(){
//获取所有的爱好框的个数
var len = $("input[name='items']").length;//
//获取所有选中的爱好框的个数
var len2 = $("input[name='items']:checked").length;
//比较
if(len == len2){
$("#checkedAllBox").attr("checked",true);
}else{
$("#checkedAllBox").attr("checked",false);
}
});
});
</script>
</head>
<body>
<form method="post" action="">
你爱好的运动是：<input type="checkbox" id="checkedAllBox" />全选/全不选 <br />
<input type="checkbox" name="items" value="足球" />足球
<input type="checkbox" name="items" value="篮球" />篮球
<input type="checkbox" name="items" value="羽毛球" />羽毛球
<input type="checkbox" name="items" value="乒乓球" />乒乓球
</form>
</body>
</html>
633
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
