利用JS实现简单的全选，全不选，与反选

最新推荐文章于 2021-05-09 15:09:15 发布

cheese年糕

最新推荐文章于 2021-05-09 15:09:15 发布

阅读量207

点赞数

分类专栏：前端文章标签：复选框 JS 前端全选反选

本文链接：https://blog.csdn.net/qq_40933991/article/details/89407694

版权

前端专栏收录该内容

5 篇文章 0 订阅

订阅专栏

利用JavaScript实现简单的全选，全不选，与反选

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			var list=document.getElementsByName("choose");
			function allchoose(){
				for(var i=0;i<list.length;i++){
					list[i].checked=true;
				}
			}
			function nonechoose(){
				for(var i=0;i<list.length;i++){
					list[i].checked=false;
				}
			}
			function reservechoose(){
				for(var i=0;i<list.length;i++){
					list[i].checked=!list[i].checked;
				}
			}
		</script>
	</head>
	<body>
		<input type="button" value="全选" onclick="allchoose()" />
		<input type="button" value="全不选" onclick="nonechoose()" />
		<input type="button" value="反选" onclick="reservechoose()" />
		
		<input type="checkbox" name="choose" />吃饭
		<input type="checkbox" name="choose" />睡觉
		<input type="checkbox" name="choose" />打豆豆
		<input type="checkbox" name="choose" />看电视
		<input type="checkbox" name="choose" />做游戏
		
	</body>
</html>

cheese年糕

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
利用JS实现简单的全选，全不选，与反选

利用JavaScript实现简单的全选，全不选，与反选<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> var list=document.g...
复制链接

扫一扫