js中关于复选框的多选和反选

最新推荐文章于 2023-04-20 09:05:25 发布

林子夕

最新推荐文章于 2023-04-20 09:05:25 发布

阅读量537

点赞数

分类专栏：编程之路文章标签： javascript

本文链接：https://blog.csdn.net/qq_21935367/article/details/50437837

版权

编程之路专栏收录该内容

26 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<title>复选框全选/反选功能</title>
<meta charset="utf-8">
<script type="text/javascript">
window.οnlοad=function(){
var x=document.getElementById("all");
var n=document.getElementById("all2");

var y=document.getElementsByName("box");

//全选

x.οnchange=function(){
for(var i=0;i<y.length;i++){
y[i].checked=x.checked;
}

}

//反选

n.οnchange=function(){
for(var i=0;i<y.length;i++){
if(y[i].checked==true){
y[i].checked=false;
}
else{
y[i].checked=true;
}
}
}
}

</script>
</head>
<body>
<input type="checkbox" name="all" id="all" value="1" >全选
<input type="checkbox" name="all" id="all2" value="1" >反选
<input type="checkbox" name="box" value="1" >1
<input type="checkbox" name="box" value="2" >2
<input type="checkbox" name="box" value="3" >3
<input type="checkbox" name="box" value="4" >4
<input type="checkbox" name="box" value="5" >5
</body>
</html>