js小功能1:全选全不选

时间:2022-08-24 19:46:47

js小功能1:全选全不选

  <form>
请选择你爱好:<br> <input type="checkbox" name="hobby" id="hobby1"> 音乐 <input type="checkbox" name="hobby" id="hobby2"> 登山 <input type="checkbox" name="hobby" id="hobby3"> 游泳 <input type="checkbox" name="hobby" id="hobby4"> 阅读 <input type="checkbox" name="hobby" id="hobby5"> 打球 <input type="checkbox" name="hobby" id="hobby6"> 跑步 <br> <input type="button" value = "全选" onclick = "checkall();"> <input type="button" value = "全不选" onclick = "clearall();">
</
form>
<script>
function checkall(){
var input_all = document.getElementsByName("hobby");
for(var i=0;i<input_all.length;i++){
if(input_all[i].type==='checkbox'){
input_all[i].checked=true
}
}
}
function clearall(){
var input_all = document.getElementsByName("hobby");
for(var i=0;i<input_all.length;i++){
if(input_all[i].type==='checkbox'){
input_all[i].checked=false
}
}
}


</script>