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 相关文章推荐
iframe 上下滚动条如何默认在下方实现原理
Dec 10 Javascript
jquery实现可拖动DIV自定义保存到数据的实例
Nov 20 Javascript
jQuery实现响应浏览器缩放大小并改变背景颜色
Oct 31 Javascript
JavaScript实现DIV层拖动及动态增加新层的方法
May 12 Javascript
JavaScript用二分法查找数据的实例代码
Jun 17 Javascript
VUE element-ui 写个复用Table组件的示例代码
Nov 18 Javascript
如何去除vue项目中的#及其ie9兼容性
Jan 11 Javascript
eslint 的三大通用规则详解
May 16 Javascript
vue组件命名和props命名代码详解
Sep 01 Javascript
es6中reduce的基本使用方法
Sep 10 Javascript
react antd表格中渲染一张或多张图片的实例
Oct 28 Javascript
vue报错function () { [native code] },无法出现我们想要的内容 Unknown custom element
Apr 11 Vue.js
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
风味层面去分析咖啡油脂
2021/03/03 咖啡文化
php 上一篇,下一篇文章实现代码与原理说明
2010/05/09 PHP
PHP+javascript制作带提示的验证码源码分享
2014/05/28 PHP
PHP 根据key 给二维数组分组
2016/12/09 PHP
CI框架(CodeIgniter)实现的数据库增删改查操作总结
2018/05/23 PHP
jQuery 判断元素上是否绑定了事件
2009/10/28 Javascript
JavaScript中通过闭包解决只能取得包含函数中任何变量最后一个值的问题
2010/08/12 Javascript
JS 控制小数位数的实现代码
2011/08/02 Javascript
js页面跳转的常用方法整理
2013/10/18 Javascript
教你使用javascript简单写一个页面模板引擎
2015/05/05 Javascript
使用Node.js实现HTTP 206内容分片的教程
2015/06/23 Javascript
javascript实现保留两位小数的多种方法
2015/12/18 Javascript
jquery实现点击弹出可放大居中及关闭的对话框(附demo源码下载)
2016/05/10 Javascript
JavaScript中的Array 对象(数组对象)
2016/06/02 Javascript
JavaScript面试开发常用的知识点总结
2016/08/08 Javascript
BootStrap实现邮件列表的分页和模态框添加邮件的功能
2016/10/13 Javascript
原生js实现倒计时功能(多种格式调用)
2017/01/12 Javascript
js实现图片加载淡入淡出效果
2017/04/07 Javascript
vue2.0+vue-dplayer实现hls播放的示例
2018/03/02 Javascript
在webstorm开发微信小程序之使用阿里自定义字体图标的方法
2018/11/15 Javascript
解决IOS端微信H5页面软键盘弹起后页面下方留白的问题
2019/06/05 Javascript
Python多线程编程(七):使用Condition实现复杂同步
2015/04/05 Python
python距离测量的方法
2018/03/06 Python
对python列表里的字典元素去重方法详解
2019/01/21 Python
python创建学生成绩管理系统
2019/11/22 Python
Centos7下源码安装Python3 及shell 脚本自动安装Python3的教程
2020/03/07 Python
详解Python openpyxl库的基本应用
2021/02/26 Python
html5简单示例_动力节点Java学院整理
2017/07/07 HTML / CSS
TIME时代杂志台湾总代理:台时亚洲
2018/10/22 全球购物
大专自我鉴定范文
2013/10/23 职场文书
高分子材料与工程专业推荐信
2013/12/01 职场文书
前台文员岗位职责
2013/12/28 职场文书
毕业生的自我评价
2013/12/30 职场文书
优秀经理事迹材料
2014/02/01 职场文书
写自招自荐信的绝招!
2019/04/19 职场文书
Spring Boot优化后启动速度快到飞起技巧示例
2022/07/23 Java/Android