jQuery实现全选反选全不选案例
<html>
<head>
<meta charset="utf-8"/>
<script type="text/javascript" src="../script/jquery-1.4.2.min.js"></script>
<script>
$(function(){
//全选
$("#checkAll").click(function(){
$(":checkbox").attr("checked",true);
});
//全不选
$("#checkNo").click(function(){
$(":checkbox").attr("checked",false);
});
//反选
$("#reverse").click(function(){
//先找到所有的复选框,然后循环遍历每一个复选框 each()相当于foreach()
$(":checkbox[name=items]").each(function(){
$(this).attr("checked",!$(this).attr("checked"));
});
});
});
</script>
</head>
<body>
<form action="#" method="post">
<input type="checkbox" name="items" value="篮球"/>篮球
<input type="checkbox" name="items" value="篮球"/>足球
<input type="checkbox" name="items" value="篮球"/>羽毛球
<input type="checkbox" name="items" value="篮球"/>乒乓球
<input type="checkbox" name="items" value="篮球"/>保龄球
<input type="checkbox" name="items" value="篮球"/>高尔夫球<br/>
<input type="button" id="checkAll" value="全选"/>
<input type="button" id="checkNo" value="全不选"/>
<input type="button" id="reverse" value="反选"/>
</form>
</body>
</html>
