js实现全选和全不选
导读：本文实例为大家分享了js实现全选和全不选的具体代码，供大家参考，具体内容如下非常简洁的几行原生js实现全选和全不选，大神们可以在此基础上加上反选功能。<!DOCTYPE html><html><head> <meta charset='utf-8'> ...
本文实例为大家分享了js实现全选和全不选的具体代码，供大家参考，具体内容如下
非常简洁的几行原生js实现全选和全不选，大神们可以在此基础上加上反选功能。
<!DOCTYPE html><html><head> <meta charset='utf-8'> <title>全选、全不选</title></head><body><table border='1'> <tr> <td><input type='checkbox' name='mmAll' onclick='All(this, ’mm[]’)'></td> </tr> <tr><td><input type='checkbox' value='1' name='mm[]' onclick='Item(this, ’mmAll’)'></td></tr> <tr><td><input type='checkbox' value='2' name='mm[]' onclick='Item(this, ’mmAll’)'></td></tr> <tr><td><input type='checkbox' value='3' name='mm[]' onclick='Item(this, ’mmAll’)'></td></tr> <tr><td><input type='checkbox' value='4' name='mm[]' onclick='Item(this, ’mmAll’)'></td></tr> <tr><td><input type='checkbox' value='5' name='mm[]' onclick='Item(this, ’mmAll’)'></td></tr> <tr><td><input type='checkbox' value='6' name='mm[]' onclick='Item(this, ’mmAll’)'></td></tr></table></body></html><script type='text/javascript'> //Check all function All(e, itemName) { var aa = document.getElementsByName(itemName); for (var i=0; i < aa.length; i++) aa[i].checked = e.checked; //得到那个总控的复选框的选中状态 } //Single select function Item(e, allName) { var all = document.getElementsByName(allName)[0]; if(!e.checked) all.checked = false; else { var aa =document.getElementsByName(e.name); for (var i=0; i<aa.length; i++) if(!aa[i].checked) return; all.checked= true; } }</script>
效果图：
更多关于复选框的文章请点击专题：javascript复选框操作汇总、jquery复选框操作汇总
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持好吧啦网。
相关文章：
1. CSS3实例分享之多重背景的实现(Multiple backgrounds)2. intellij idea中spring boot properties文件不能自动提示问题解决3. Android自定义Dialog框样式4. 使用Canal实现PHP应用程序与MySQL数据库的实时数据同步5. 一篇文章带你了解JavaScript-语句6. 详解IDEA搭建springBoot方式一(推荐)7. asp.net core服务限制堆内存大小的操作方法8. intellij idea写Python教程9. Android Studio导入jar包过程详解10. IntelliJ IDEAx导出安卓（Android）apk文件图文教程
网公网安备