尚硅谷：全选和反选

84 阅读 0 评论 56 点赞

我是靠谱客的博主体贴毛巾，最近开发中收集的这篇文章主要介绍尚硅谷：全选和反选，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

1、代码

<!doctype html>
<html>
 <head>
	<!--声明当前页面的编码集：charset=gbk,gb2312(中文编码)，utf-8国际编码-->
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<!--当前页面的三要素-->
	<title>尚硅谷：全选和反选案例</title>
	<meta name="Keywords" content="关键词,关键词">
	<meta name="description" content="">
	<script type="text/javascript" src="jquery-1.7.2.js"></script>
	<script type="text/javascript">
		$(function() {
			$("#checkAll").click(function() {
				var flag = this.checked;
				$(":checkbox[name='items']").attr("checked",flag);
			});
		});
	</script>
 </head>
 <body>
 	全选/反选<input type="checkbox" id="checkAll"></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="书法"/>书法
 </body>
</html>

2、界面显示