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的闭包
Jan 17 Javascript
Javascript判断图片尺寸大小实例分析
Jun 16 Javascript
js实现简单选项卡与自动切换效果的方法
Apr 10 Javascript
快速学习jQuery插件 Form表单插件使用方法
Dec 01 Javascript
封装好的javascript前端分页插件pagination
Jan 04 Javascript
JavaScript实现一个空中避难的小游戏
Jun 06 Javascript
vue.js父子组件通信动态绑定的实例
Sep 28 Javascript
JavaScript的级联函数用法简单示例【链式调用】
Mar 26 Javascript
微信小程序中使用Async-await方法异步请求变为同步请求方法
Mar 28 Javascript
原生js实现each方法实例代码详解
May 27 Javascript
ES10的13个新特性示例(小结)
Sep 23 Javascript
JS实现页面数据懒加载
Feb 13 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
一组PHP加密解密函数分享
2014/06/05 PHP
PHP实现的数组和XML文件相互转换功能示例
2018/03/15 PHP
原生Js实现按的数据源均分时间点幻灯片效果(已封装)
2010/12/28 Javascript
基于JavaScript 类的使用详解
2013/05/07 Javascript
nodejs中使用monk访问mongodb
2014/07/06 NodeJs
网页禁用右键菜单和鼠标拖动选择方法小结
2015/02/25 Javascript
jquery SweetAlert插件实现响应式提示框
2015/08/18 Javascript
基于jQuery实现简单的折叠菜单效果
2015/11/23 Javascript
JavaScript File API文件上传预览
2016/02/02 Javascript
AngularJS执行流程详解
2017/02/17 Javascript
vue获取input输入值的问题解决办法
2017/10/17 Javascript
实现div滚动条默认最底部以及默认最右边的示例代码
2017/11/15 Javascript
vue 页面加载进度条组件实例
2018/02/05 Javascript
JavaScript实现微信红包算法及问题解决方法
2018/04/26 Javascript
详解用Webpack与Babel配置ES6开发环境
2019/03/12 Javascript
在vue中使用jsx语法的使用方法
2019/09/30 Javascript
python使用Matplotlib绘制分段函数
2018/09/25 Python
Django url,从一个页面调到另个页面的方法
2019/08/21 Python
Python使用进程Process模块管理资源
2020/03/05 Python
Python如何给你的程序做性能测试
2020/07/29 Python
Python面向对象多态实现原理及代码实例
2020/09/16 Python
python字典通过值反查键的实现(简洁写法)
2020/09/30 Python
如何利用python读取micaps文件详解
2020/10/18 Python
HTML5之WebGL 3D概述(上)—WebGL原生开发开启网页3D渲染新时代
2013/01/31 HTML / CSS
Amcal中文官网:澳洲综合性连锁药房
2019/03/28 全球购物
什么是典型的软件三层结构?软件设计为什么要分层?软件分层有什么好处?
2012/03/14 面试题
法雷奥SQA(electric)面试问题
2016/01/23 面试题
《临死前的严监生》教学反思
2014/02/13 职场文书
个人租房协议书样本
2014/10/01 职场文书
2014年节能工作总结
2014/12/18 职场文书
2015年收银工作总结范文
2015/04/01 职场文书
乒乓球比赛通知
2015/04/27 职场文书
贷款工资证明范本
2015/06/12 职场文书
2016年暑期见闻作文
2015/11/25 职场文书
Python装饰器的练习题
2021/11/23 Python
MySQL 语句执行顺序举例解析
2022/06/05 MySQL