首页 > 代码库 > checkbox 的全选与全不选
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 的全选与全不选
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。