通过jquery实现复选框全选效果
实现的js和页面的HTML如下：
<!-- jquery引入到这个jsp里面 -->
<script type="text/javascript" src="js/jquery-1.12.4.js"></script>
<!-- 我们的jquery代码 -->
<script type="text/javascript">
//页面加载
$(function(){
//页面加载完后，给全选框添加一个点击事件
$("input:checkbox:first").click(
function(){
//var t=$("input:checkbox:first").prop("checked");
//this表示当前元素，谁调用了这个函数，谁就是当前元素。
//this但是他表示的dom元素
var t=$(this).prop("checked");
$("[name=f]").prop("checked",t);
}
);
});
function test(){
//处于选中的状态的复选框
if($("[name=f]:checked").size()==$("[name=f]").size()){
$("input:checkbox:first").prop("checked",true);
}else{
$("input:checkbox:first").prop("checked",false);
}
}
</script>
</head>
<body>
<input type="checkbox"/>全选<br/>
<input type="checkbox" name="f" onclick="test()"/>1<br/>
<input type="checkbox" name="f" onclick="test()"/>2<br/>
<input type="checkbox" name="f" onclick="test()"/>3<br/>
</body>
</html>
