checkbox全选
Posted 袁浩178
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了checkbox全选相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>全选</title> <script> //全选按钮选中,单选按钮全部选中, function TabClick(){ var flag=document.getElementById("checkboxID").checked; if(flag==true){ var check_arr=document.getElementsByName("checkboxIDD"); var count=check_arr.length; for(var i=0;i<count;i++){ check_arr[i].checked=true; } } else{ var check_arr=document.getElementsByName("checkboxIDD"); var count=check_arr.length; for(var i=0;i<count;i++){ check_arr[i].checked=false; } } } //如果单选按钮全部选中,则全选按钮选中,如果有一个单选按钮没有选中,则全选按钮不选中 function onclickFlag() { var check_arr=document.getElementsByName("checkboxIDD"); var count=check_arr.length; for(var i=0;i<count;i++){ if(check_arr[i].checked==false){ document.getElementById("checkboxID").checked=false; return; } else { document.getElementById("checkboxID").checked=true; } } } </script> </head> <body> <table id="tab" border="1px" width="500px" height="200px"> <thead> <tr> <th><input id="checkboxID" type ="checkbox" onclick="TabClick()" />全选</th> <th>12</th> <th>13</th> <th>14</th> </tr> </thead> <tbody> <tr> <td><input name="checkboxIDD" id="aa" type="checkbox" onclick="onclickFlag()"/>单选</td> <td>22</td> <td>23</td> <td>24</td> </tr> <tr> <td><input name="checkboxIDD" type="checkbox" onclick="onclickFlag()"/>单选</td> <td>32</td> <td>33</td> <td>34</td> </tr> <tr> <td><input name="checkboxIDD" type="checkbox" onclick="onclickFlag()"/>单选</td> <td>42</td> <td>43</td> <td>44</td> </tr> </tbody> </table> </body> </html>
以上是关于checkbox全选的主要内容,如果未能解决你的问题,请参考以下文章
jQuery设置checkbox全选(区别jQuery版本)
jquery checkbox全选,全不选,反选方法,jquery checkbox全选只能操作一次