JS点击全选效果

最新推荐文章于 2023-07-18 11:18:07 发布

weixin_43843044

最新推荐文章于 2023-07-18 11:18:07 发布

阅读量772

点赞数

分类专栏：基础学习文章标签： JS点击全选效果

本文链接：https://blog.csdn.net/weixin_43843044/article/details/85229483

版权

基础学习专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<input type="checkbox" name="" id="all" value="" />全选
		<input type="checkbox" class="check_box" id="" value="" />1
		<input type="checkbox" class="check_box" id="" value="" />2
		<input type="checkbox" class="check_box" id="" value="" />3
		<input type="checkbox" class="check_box" id="" value="" />4
		<input type="checkbox" class="check_box" id="" value="" />5
		<input type="checkbox" class="check_box" id="" value="" />6
		<input type="checkbox" class="check_box" id="" value="" />7
		<input type="checkbox" class="check_box" id="" value="" />8
		<script>
			var arrch=document.getElementsByClassName("check_box");
			var oall=document.getElementById("all");
				oall.onclick=function(){
					if (oall.checked) {
						for (i=0;i<arrch.length;i++) {
							arrch[i].checked=true;
						}
					} else if(!oall.checked){
						for (i=0;i<arrch.length;i++) {
							arrch[i].checked=false;
						}
					}
				}
				for (j=0;j<arrch.length;j++) {
					arrch[j].onclick=function(){
						oall.checked=true;
						for (x=0;x<arrch.length;x++) {
							if(!arrch[x].checked){
								oall.checked=false;
							}
						}
							
					}
				}
		</script>
	</body>
</html>

weixin_43843044

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS点击全选效果

&lt;!DOCTYPE html&gt;&lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;/head&gt; &lt;body&gt; &lt;input type="checkbox" n
复制链接

扫一扫