zoukankan      html  css  js  c++  java
  • JS全选与不选、反选

    思路:

    1、获取元素。

    2、用for循环历遍数组,把checkbox的checked设置为true即实现全选,把checkbox的checked设置为false即实现不选。

    3、通过if判断,如果checked为true选中状态的,就把checked设为false不选状态,如果checked为false不选状态的,就把checked设为true选中状态。

    <!DOCTYPE html>

    <html>
        <head><meta charset="UTF-8"></head>
        <body>
            <div id="div">
                <input type="checkbox" /><br />
                <input type="checkbox" /><br />
                <input type="checkbox" /><br />
            </div>
            <input type="button" value="全选" onclick="CheckAll()"/><br />
            <input type="button" value="不选" onclick="UnCheck()"/><br />
            <input type="button" value="反选" onclick="othercheck()"/><br />
            <script>
                var CheckBox=div.getElementsByTagName('input');
                 
                //全选
                function CheckAll(){
                    for(i=0;i<CheckBox.length;i++){CheckBox[i].checked=true;};
                };
                 
                //不选
                function UnCheck(){
                    for(i=0;i<CheckBox.length;i++){CheckBox[i].checked=false;};
                    };
                 
                //反选
                function othercheck(){
                    for(i=0;i<CheckBox.length;i++){
                        if(CheckBox[i].checked==true){ CheckBox[i].checked=false;}
                        else{ CheckBox[i].checked=true}
                    }
                };
            </script>
        </body>
    </html>
  • 相关阅读:
    AOP入门之静态代理
    C# 6 与 .NET Core 1.0 高级编程
    C# 6 与 .NET Core 1.0 高级编程
    C# 6 与 .NET Core 1.0 高级编程
    C# 6 与 .NET Core 1.0 高级编程
    C# 6 与 .NET Core 1.0 高级编程
    C# 6 与 .NET Core 1.0 高级编程
    C# 6 与 .NET Core 1.0 高级编程
    C# 6 与 .NET Core 1.0 高级编程
    C# 6 与 .NET Core 1.0 高级编程
  • 原文地址:https://www.cnblogs.com/zhangjinghe/p/7528970.html
Copyright © 2011-2022 走看看