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 相关文章推荐
精通JavaScript 纠正 cleanWhitespace函数
Mar 11 Javascript
各情景下元素宽高的获取实现代码
Sep 13 Javascript
如何使用jquery动态加载js,css文件实现代码
Apr 03 Javascript
js匿名函数的调用示例(形式多种多样)
Aug 20 Javascript
jQuery事件用法实例汇总
Aug 29 Javascript
javascript移动开发中touch触摸事件详解
Mar 18 Javascript
Angular.js中ng-if、ng-show和ng-hide的区别介绍
Jan 20 Javascript
JavaScript之Canvas_动力节点Java学院整理
Jul 04 Javascript
angular+ionic返回上一页并刷新页面
Aug 08 Javascript
微信小程序顶部可滚动导航效果
Oct 31 Javascript
webpack external模块的具体使用
Mar 10 Javascript
vue项目中实现图片预览的公用组件功能
Oct 26 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
在JavaScript中调用php程序
2009/03/09 PHP
简单的移动设备检测PHP脚本代码
2011/02/19 PHP
解析PHP多种序列化与反序列化的方法
2013/06/06 PHP
CodeIgniter输出中文乱码的两种解决办法
2014/06/12 PHP
php操作redis数据库常见方法实例总结
2020/02/20 PHP
jquery判断浏览器类型的代码
2012/11/05 Javascript
JS完成代码前最好对其做5件事
2013/04/07 Javascript
node.js中的buffer.Buffer.isEncoding方法使用说明
2014/12/14 Javascript
node.js中的fs.createWriteStream方法使用说明
2014/12/17 Javascript
使用javascript实现Iframe自适应高度
2014/12/24 Javascript
JavaScript中的数组特性介绍
2014/12/30 Javascript
js正则表达式匹配数字字母下划线等
2015/04/14 Javascript
javascript动态创建链接的方法
2015/05/13 Javascript
推荐阅读的js快速判断IE浏览器(兼容IE10与IE11)
2015/12/13 Javascript
javascript+HTML5自定义元素播放焦点图动画
2016/02/21 Javascript
jQuery元素属性操作实例(设置、获取及删除元素属性)
2016/09/08 Javascript
JavaScript中关于iframe滚动条的去除和保留
2016/11/17 Javascript
详解在Angularjs中ui-sref和$state.go如何传递参数
2017/04/24 Javascript
vue 添加vux的代码讲解
2017/11/30 Javascript
nginx部署访问vue-cli搭建的项目的方法
2018/02/12 Javascript
详解性能更优越的小程序图片懒加载方式
2018/07/18 Javascript
Node.js中package.json中库的版本号(~和^)
2019/04/02 Javascript
vue项目打包上传github并制作预览链接(pages)
2019/04/19 Javascript
JavaScript布尔运算符原理使用解析
2020/05/06 Javascript
Python构造函数及解构函数介绍
2015/02/26 Python
Django中传递参数到URLconf的视图函数中的方法
2015/07/18 Python
Python用户推荐系统曼哈顿算法实现完整代码
2017/12/01 Python
Python实现爬取百度贴吧帖子所有楼层图片的爬虫示例
2018/04/26 Python
Python设计模式之抽象工厂模式原理与用法详解
2019/01/15 Python
利用纯CSS3实现动态的自行车特效源码
2017/01/20 HTML / CSS
我们是伦敦女孩:WalG
2018/01/08 全球购物
ECOSUSI官网:女式皮革背包
2019/09/27 全球购物
编写类String的构造函数、析构函数和赋值函数
2012/05/29 面试题
2014国培学习感言
2014/03/05 职场文书
销售工作决心书
2015/02/04 职场文书
SpringCloud Alibaba项目实战之nacos-server服务搭建过程
2021/06/21 Java/Android