checkBox全选全不选

来源：互联网发布：java api监控系统性能编辑：程序博客网时间：2024/06/06 01:31

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="jquery-1.8.3.min.js"></script>
    <script type="text/JavaScript">
       /* function check(){
            var oInput=document.getElementsByName("checkBox2");
            for (var i=0;i<oInput.length;i++)
                oInput[i].checked=document.getElementById("all").checked;
        }*/
       var allCheckbox=document.getElementsByName("checkBox2");
        function check(){
            var allCheckbox=document.getElementsByName("checkBox2");
            for(var p in allCheckbox){
                allCheckbox[p].checked=document.getElementById("all").checked;
            }
        }
        function isAll(){
            /*先定义一个int变量*/
            var count=0;
            for(var i=0;i<allCheckbox.length;i++){
                if(allCheckbox[i].checked==true){
                    count++;
                }
            }
            //alert(""+count+","+allCheckbox.length)
            if(count==allCheckbox.length){
                document.getElementById("all").checked=true;
            }
            if(count!=allCheckbox.length){
                document.getElementById("all").checked=false;
            }
        }
    </script>
</head>
<body>
<table>
    <tr>
        <td><input type="checkbox" value="" class="all" id="all" onclick="check()">全选</td>
    </tr>
    <tr>
        <td><input type="checkbox" value="java" name="checkBox2" class="checkBox1" onclick="isAll()">java</td>
        <td><input type="checkbox" value="锋利的jquery" name="checkBox2" class="checkBox1" onclick="isAll()">锋利的jquery</td>
    </tr>
    <tr>
        <td><input type="checkbox" value="javascript" name="checkBox2" class="checkBox1" onclick="isAll()">javascript</td>
        <td><input type="checkbox" value="css从入门到放弃" name="checkBox2" class="checkBox1" onclick="isAll()">css从入门到放弃</td>
    </tr>
</table>

</body>
</html>

0 0