Jquery 全选/全不选-优快云博客

本文链接：https://blog.youkuaiyun.com/iteye_15913/article/details/82402157

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>checkbox</title>
		<script src="bin/jquery.min.js"></script>
		<script>
			$(function(){
				// 全选/全不选
				$("#checkAll_2").click(function(){
					$(":checkbox[name='items']").attr("checked", $(this).is(":checked"));
				});
				$(":checkbox[name='items']").click(function(){
//					alert($(":checkbox[name='items']").length);			//全选中的个数
//					alert($(":checkbox[name='items']:checked").length );//当前选中的个数
					var flag = $(":checkbox[name='items']").length == $(":checkbox[name='items']:checked").length ;
					$("#checkAll_2").attr("checked", flag);
				});
				
				
				//全选
				$("#checkAll").click(function(){
					$(":checkbox[name='items']").attr("checked" , "checked");
				});
				//全不选 
				$("#checkNo").click(function(){
//					$(":checkbox[name='items']").attr("checked" , "");
					$(":checkbox[name='items']").removeAttr("checked");
				})	
				// 反选 
				$("#checkRev").click(function(){
					$(":checkbos[name='items']").each(function(){
						if($(this).is(":checked")){
							$(this).removeAttr("checked");
						} else {
							$(this).attr("checked", "checked");
						}
					})
				});
			});		
			
		</script>
		
	</head>
	<body>
		<form>
		你最爱好的运动是? <br>
		<input type="checkbox" id="checkAll_2">全选/全不选
		<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="乒乓球">乒乓球
		<br>
		<br>
		<input type="button" id="checkAll" value="全选">
		<input type="button" id="checkNo" value="全不选">
		<input type="button" id="checkRev" value="反选">
		<input type="button" id="send" value="提交">
		</form>
	</body>
</html>