checkbox 的全选与全不选
checkbox 的全选与全不选
只需要调用 cekAll.check();方法,这个方法接收两个参数:
参数一: 全选按钮的 id 以字符串的形式写
参数二: 其他 checkbox 的 name 值 也是以字符串的形式写
使用很简单 : 复制 js 代码到你的 js 文件的任何地方,只需要在HTML文档加载完以后调用 cekAll.check();传入参数即可 什么点击事件,什么获取对象,统统不用写,
装点:不管你的 checkbox 是写到页面上的还是动态读取的,都不需要加事件。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
var cekAll = {
'num':0,
check:function(part,chid){
var parent = document.getElementById(part);
var child = document.getElementsByName(chid);
parent.onclick = function(){
if(parent.checked != true){
for(var j = 0;j<child.length;j++){
child[j].checked = false;
cekAll.num = 0;
};
}else{
for(var i=0;i< child.length;i++){
if(parent.checked == true){
child[i].checked = true;
cekAll.num = child.length;
};
};
};
};
cekAll.childClick(part,chid);
},
childClick:function(one,two){
var one1 = document.getElementById(one);
var two1 = document.getElementsByName(two);
for(var j = 0;j< two1.length;j++){
two1[j].onclick = (function(){
return function(){
if(this.checked == false){
one1.checked = false;
cekAll.num--;
}else{
cekAll.num ++;
if(cekAll.num == two1.length){
one1.checked = true;
};
};
};
})();
};
}
};
</script>
</head>
<body>
<div>
<input type="checkbox" id="quanxuan"/>全选<br/>
</div>
<script>
// 动态添加的 checkbox 跟写到页面上是一样的
var div = document.getElementsByTagName('div')[0];
var arr = ['吃饭','睡觉','打豆豆'];
for(i in arr){
var str = '<input type="checkbox" name="che1">'+arr[i]+'';
div.innerHTML += str;
}
// -- 静态写到页面上的、动态添加的,调用 cekAll.check(); 方法的书写格式都一样
cekAll.check('quanxuan','che1');
</script>
</body>
</html>
checkbox 的全选与全不选的更多相关文章
- CheckBox复选框全选以及获取值
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- jquery的checkbox 全选和全不选
今天写了一个checkbox的全选和全不选的功能: var check_all=function(){ if(this.checked){ //alert($(".adv_check_num ...
- jQuery checkbox 所有 全选、全不选、是否选中等
下面是网络收集: jquery判断checked的三种方法:.attr('checked): //看版本1.6+返回:”checked”或”undefined” ;1.5-返回:true或fals ...
- jQuery对复选框(checkbox)的全选,全不选,反选等的操作
效果截图: HTML代码: <body><ul id="list"> <li><label><input type=" ...
- jQuery实现CheckBox全选、全不选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery checkbox全选,全不选,反选方法,jquery checkbox全选只能操作一次
jquery checkbox全选,全不选,反选方法, jquery checkbox全选只能操作一次, jquery checkbox全选只有第一次成功 >>>>>&g ...
- Jquery CheckBox复选框 全选/取消全选 最佳实现方式 参考案例
<input id="chkAll" type="checkbox" />全选/取消全选</div> <asp:Repeater ...
- checkbox复选框全选批量删除
多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...
- 关于在repeater中的checkbox实行多选和全选
今天项目中用到这一块,是一个b2b商城,业务是别人给客户留言后,客户从会员中心的留言管理中查看,用checkbox实行多选和全选后进行批量审核 首先在checkbox后加个hidden,作用见代码: ...
随机推荐
- HTML表格
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- iOS开发MAC下配置Svn和Git
如果你对iOS开发中的版本控制还不了解那么你可以先看看这篇(大致看一遍就ok) http://www.cnblogs.com/iCocos/p/4767692.html 关于版本控制使用起来并不难 ...
- 回发或回调参数无效。在配置中使用 <pages enableEventValidation="true"/> 或在页面中使用 <%@ Page EnableEventValidation="true" %> 启用了事件验证。
问题补充: “/Source”应用程序中的服务器错误. 回发或回调参数无效.在配置中使用 <pages enableEventValidation="true"/> 或 ...
- .net 获取https页面的信息 在iis7.5服务器上不管用
让我纠结了一天多的问题,给大家看下,有相同情况的可以不用浪费时间了,本人当时找了好半天都没找到什么有用的信息,项目在本地没有问题,但部署在服务器后,获取不到https页面的信息,加入下面的代码就可以了 ...
- timestamp 类型的索引
由这条语句datetime.strftime('2014/12/05','%Y/%m/%d')转换出来的索引 是pandas内置类型相同,如果使用datetime.strftime('2014/12/ ...
- Http返回码
HTTP协议状态码表示的意思主要分为五类 ,大体是 : ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 1×× 保留 2×× 表示请求成功地接收 3×× 为完成请求客户需 ...
- 按键消抖-----verilog
实际系统中常用的按键大部分都是轻触式按键,如下图所示.该按键内部由一个弹簧片和两个固定触点组成,当弹簧片被按下,则两个固定触点接通,按键闭合.弹簧片松开,两个触点断开,按键也就断开了.根据这种按键的机 ...
- sprintf_s的使用
int sprintf_s(char *restrict buffer, rsize_t bufsz, const char *restrict format, ...); ...
- [webkit移动开发笔记]之如何去除android上a标签产生的边框(转)
转载地址:http://www.cnblogs.com/PeunZhang/archive/2013/02/28/2907708.html 去年年底,做完最后一个项目就可以开开心心回家,可是在测试阶段 ...
- 关于Python 获取windows信息收集
收集一些Python操作windows的代码 (不管是自带的or第三方库)均来自网上 1.shutdown 操作 定时关机.重启.注销 #!/usr/bin/python #-*-coding:utf ...