Checkbox Function

作者: Jadon7 | 来源:发表于2018-10-06 22:41 被阅读0次

Checkbox Function
JQ批量选中checkbox以及提交
layui-tree添加选择框功能
2018-04-19 Jquery checkbox 是使用
原生JS——checkbox操作技巧
CheckBox多选框
自动化测试——selenium之checkbox全选、取消选中
日入一词_117 tick
Bootstrap table 单击列标题或表头事件控制多列的
Android中常用控件

<!DOCTYPE html>
<html>
<head>
    <title>checkbox function</title>
</head>
<script type="text/javascript">
    window.onload=function()
    {
        var oBtn=document.getElementById('btn');
        var oBtn2=document.getElementById('btn2');
        var oBtn3=document.getElementById('btn3');
        var oDiv=document.getElementById('allCheckbox');
        var aCh=oDiv.getElementsByTagName('input')
        oBtn.onclick=function()
        {
            for (var i = 0; i < aCh.length; i++) 
            {
                aCh[i].checked=true;
            }

        }

        oBtn2.onclick=function()
        {
            for (var i = 0; i < aCh.length; i++) 
            {
                aCh[i].checked=false;
            }

        }

        oBtn3.onclick=function()
        {
            for (var i = 0; i < aCh.length; i++) 
            {
                if (aCh[i].checked===false) 
                {
                    aCh[i].checked=true;
                }
                else
                {
                    aCh[i].checked=false;
                }
            }

        }
        
    }
</script>
<body>
 <input id="btn" type="button" value="all"></br>
 <input id="btn2" type="button" value="allCancel"></br>
 <input id="btn3" type="button" value="contrary"></br>
 <div id="allCheckbox">
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
     <input type="checkbox"></br>
 </div>
</body>
</html>