checkbox全选和取消全选

最新推荐文章于 2019-01-12 22:21:00 发布

转载最新推荐文章于 2019-01-12 22:21:00 发布 · 64 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/freespider/archive/2012/04/24/2468414.html

本文介绍了一种实现网页中复选框全选及取消全选功能的方法。通过JavaScript函数CheckAll()来控制所有子复选框的状态，并使用unselectall()函数取消所有选择。该方法适用于需要批量操作复选框的场景。

<script language=javascript>
 
function unselectall(){
 if(document.myform.chkAll.checked){
 document.myform.chkAll.checked = document.myform.chkAll.checked&0;
 }
}
function CheckAll(form){
 for (var i=0;i<form.elements.length;i++){
 var e = form.elements[i];
 if (e.Name != 'chkAll'&&e.disabled==false)
 e.checked = form.chkAll.checked;
 }
 }
 </script>

 
在网页中html中的代码:
 
<form name="myform" method="post" id="myform" action="" >
 
<input name='id' type='checkbox' onclick='unselectall()' id='id' value='1'> 设计家园
 
<input name='id' type='checkbox' onclick='unselectall()' id='id' value='2'> 网页教程
 
<input name='id' type='checkbox' onclick='unselectall()' id='id' value='3'> 酷站欣赏
 
<input name='id' type='checkbox' onclick='unselectall()' id='id' value='4'> 网页素材
 
<input name='chkAll' type='checkbox' id='chkAll' onclick='CheckAll(this.form)' value='checkbox'>
全选
 
</form>

转载于:https://www.cnblogs.com/freespider/archive/2012/04/24/2468414.html