CheckBox 如何实现全选?


Posted in Javascript onJune 23, 2006

在一个表单中有很多CheckBox,请问如何实现选种一个而让所有的都选中?  
---------------------------------------------------------------  

function  selectAll(checkBoxName){  
           var  elms  =  document.getElementsByName(checkBoxName);  
           if  (elms.length<1)  return;  
           var  allChecked  =  true;  
           for  (var  i=0;i<elms.length;i++)  
                       if  (elms[i].type=="checkbox")  
                                   allChecked  &=  elms[i].checked;  
           for  (var  i=0;i<elms.length;i++)  
                       if  (elms[i].type=="checkbox"){  
                                               elms[i].checked  =  !allChecked;  
                                               if  (elms[i].onclick)  elms[i].onclick();  
                       }  
}  
---------------------------------------------------------------  

<input  type=checkbox  name=m><input  type=checkbox  name=m><input  type=checkbox  name=m><input  type=checkbox  name=m>  
<input  type=checkbox  name=m><input  type=checkbox  name=m><input  type=checkbox  name=m><input  type=checkbox  name=m>    
 全选<input  type=checkbox  value="Check  All"  onclick="mm(this)">    

<script  language=javascript>      
function  mm(o)  
{  
     var  a  =  document.getElementsByName("m");  
     for  (var  i=0;  i<a.length;  i++){  
         a[i].checked  =  o.checked;  
     }  

}  
</script>

<input type=checkbox name=chk>
<input type=checkbox name=chk>
<input type=checkbox name=chk>
<input type=checkbox name=chk>
<input type=checkbox name=chk>
<br>
全选:<input type=checkbox onclick=sel('chk')>
<script language="javascript">
 function sel(a){ 
  o=document.getElementsByName(a) 
  for(i=0;i<o.length;i++) 
  o[i].checked=event.srcElement.checked 
 }
</script> 

Javascript 相关文章推荐
js数字转换为float,取N位小数
Feb 08 Javascript
Javascript实现颜色rgb与16进制转换的方法
Apr 18 Javascript
jQuery中的ready函数与window.onload谁先执行
Jun 21 Javascript
Seajs是什么及sea.js 由来,特点以及优势
Oct 13 Javascript
Bootstrap CSS组件之导航(nav)
Dec 17 Javascript
angular.js 路由及页面传参示例
Feb 24 Javascript
javascript 中的try catch应用总结
Apr 01 Javascript
JQ图片文件上传之前预览功能的简单实例(分享)
Nov 12 Javascript
js字符串倒序的实例代码
Nov 30 Javascript
JavaScript中concat复制数组方法浅析
Jan 20 Javascript
vue+element创建动态的form表单及动态生成表格的行和列
May 20 Javascript
JS轮播图的实现方法
Aug 24 Javascript
JavaScript实际应用:innerHTMl和确认提示的使用
Jun 22 #Javascript
javascript 动态添加表格行
Jun 22 #Javascript
document 和 document.all 分别什么时候用
Jun 22 #Javascript
可输入的下拉框
Jun 19 #Javascript
强制设为首页代码
Jun 19 #Javascript
html下载本地
Jun 19 #Javascript
动态加载iframe
Jun 16 #Javascript
You might like
桌面中心(三)修改数据库
2006/10/09 PHP
Discuz板块横排显示图片的实现方法
2007/05/28 PHP
基于PHP array数组的教程详解
2013/06/05 PHP
关于php内存不够用的快速解决方法
2013/10/26 PHP
浅谈php中的访问修饰符private、protected、public的作用范围
2016/11/20 PHP
JS图片浏览组件PhotoLook的公开属性方法介绍和进阶实例代码
2010/11/09 Javascript
使用隐藏的new来创建对象
2011/03/29 Javascript
JS自动适应的图片弹窗实例
2013/06/29 Javascript
jquery统计复选框选中示例
2013/11/05 Javascript
JavaScript函数详解
2014/11/17 Javascript
JavaScript中的DSL元编程介绍
2015/03/15 Javascript
基于jquery实现左右按钮点击的图片切换效果
2021/01/27 Javascript
AngularJS Ajax详解及示例代码
2016/08/17 Javascript
微信小程序 获取设备信息 API实例详解
2016/10/02 Javascript
Bootstrap popover用法详解
2016/12/22 Javascript
BootStrap Datepicker 插件修改为默认中文的实现方法
2017/02/10 Javascript
jQuery实现搜索页面关键字的功能
2017/02/16 Javascript
JS实现简易换图时钟功能分析
2018/01/04 Javascript
详解angular脏检查原理及伪代码实现
2018/06/08 Javascript
JavaScript函数IIFE使用详解
2019/10/21 Javascript
小程序简单两栏瀑布流效果的实现
2019/12/18 Javascript
toString.call()通用的判断数据类型方法示例
2020/08/28 Javascript
python实现从网络下载文件并获得文件大小及类型的方法
2015/04/28 Python
python的文件操作方法汇总
2017/11/10 Python
英国No.1文具和办公用品在线:Euroffice
2016/09/21 全球购物
巴西女装购物网站:Eclectic
2018/04/24 全球购物
Grow Gorgeous美国官网:只要八天,体验唤醒毛囊后新生的茂密秀发
2018/06/04 全球购物
美术专业个人自我评价
2014/01/18 职场文书
大学新学期计划书
2014/04/28 职场文书
学校花圃的标语
2014/06/18 职场文书
党员个人剖析材料2014
2014/10/08 职场文书
2014年大堂经理工作总结
2014/11/21 职场文书
清洁员岗位职责
2015/02/15 职场文书
《秋思》教学反思
2016/02/23 职场文书
JavaScript中的宏任务和微任务详情
2021/11/27 Javascript
InterProcessMutex实现zookeeper分布式锁原理
2022/03/21 Java/Android