本篇是js多选框

最新推荐文章于 2021-08-04 04:33:24 发布

zyljjf

最新推荐文章于 2021-08-04 04:33:24 发布

阅读量211

点赞数 1

分类专栏： javascript 文章标签： javascript javaweb

本文链接：https://blog.csdn.net/zyljjf/article/details/78093394

版权

javascript 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

本篇是js多选框

------------------------------------------------------------------------

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.οnlοad=function(){
selAll=document.getElementById("selAll");
hobbys=document.getElementsByName("hobby");
fanxuan=document.getElementById("faxuan");

selAll.οnclick=function(){
if(selAll.checked==true){
for(var i=0;i<hobbys.length;i++){
hobbys[i].checked=true;
}
}else{
for(var i=0;i<hobbys.length;i++){
hobbys[i].checked=false;
}

}
}

//反选
fanxuan.οnclick=function(){
for(var i=0;i<hobbys.length;i++){
var b=hobbys[i];
if(b.checked == true){
b.checked=false;
}else{
b.checked=true;
}
}

}

}

</script>

</head>
<body>

<input type="checkbox" id="selAll" />全选
<button id="faxuan">反选</button>
<br>
<input type="checkbox" name="hobby" />篮球
<input type="checkbox" name="hobby" />足球
<input type="checkbox" name="hobby" />乒乓球
<input type="checkbox" name="hobby" />羽毛球
</body>
</html>