JS 案例复选框操作

最新推荐文章于 2022-10-30 20:54:47 发布

suiferq

最新推荐文章于 2022-10-30 20:54:47 发布

阅读量140

点赞数

分类专栏： JS 案例学习文章标签： js javascript

本文链接：https://blog.csdn.net/suiferq/article/details/115801450

版权

JS 案例学习专栏收录该内容

29 篇文章 4 订阅

订阅专栏

复选框操作

实现复选框的全选、反选、全不选。

代码片：

<body>
		<input type="checkbox" />足球<br/>
		<input type="checkbox" />篮球<br/>
		<input type="checkbox" />电子<br/>
		<input type="checkbox" />排球<br/>
		<hr/>
		<button type="button">全选</button>
		<button type="button">全不选</button>
		<button type="button">反选</button>
		<script type="text/javascript">
			var myinputs=document.getElementsByTagName("input");
			var mybtn=document.getElementsByTagName("button");
			mybtn[0].onclick = function(){
				for(key in myinputs){
					myinputs[key].checked=true;
				}
			}
			mybtn[1].onclick = function(){
				for(key in myinputs){
					myinputs[key].checked=false;
				}
			}
			mybtn[2].onclick=function(){
				for(key in myinputs){
					if(myinputs[key].checked){				
						myinputs[key].checked=false;
					}else{
						myinputs[key].checked=true;
					}
				}				
			}	
		</script>
	</body>