码迷,mamicode.com
首页 > 其他好文 > 详细

checkbox全选

时间:2019-07-27 18:37:01      阅读:79      评论:0      收藏:0      [点我收藏+]

标签:选中   xid   fun   round   har   span   htm   script   body   

<!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全选

标签:选中   xid   fun   round   har   span   htm   script   body   

原文地址:https://www.cnblogs.com/topsyuan/p/11256102.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!