JS实现全选反选

程序员小庞

已于 2022-10-25 17:13:44 修改

阅读量74

点赞数

分类专栏：前端文章标签： html html5 javascript

于 2021-09-08 17:27:31 首次发布

本文链接：https://blog.csdn.net/qq_45429856/article/details/120184896

版权

前端专栏收录该内容

9 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			function mychk(t){
				var hbs = document.getElementsByName("hb");
				for(var i=0;i<hbs.length;i++){
					if(t=="all"){
						hbs[i].checked=true;
					}else if(t=="no"){
						hbs[i].checked=false;
					}else if(t=="rev"){
						hbs[i].checked=!hbs[i].checked;
					}
				}
			}
		</script>
	<body>
		<h3>请选择你的爱好：</h3>
		<input type="checkbox" name="hb" value="足球"/>足球
		<input type="checkbox" name="hb" value="篮球"/>篮球
		<input type="checkbox" name="hb" value="乒乓球"/>乒乓球
		<input type="checkbox" name="hb" value="羽毛球"/>羽毛球
		<input type="checkbox" name="hb" value="小说"/>小说
		<input type="checkbox" name="hb" value="登山"/>登山<br />
		<a href="javascript:mychk('all');">全选</a>
		<a href="javascript:mychk('no');">全不选</a>
		<a href="javascript:mychk('rev');">反选</a>
	</body>
</html>