zoukankan      html  css  js  c++  java
  • 全选,反选,全不选整理

    HTML代码

        <input type="checkbox" class="chk" name="" id="" value=""/>
            <input type="checkbox" class="chk" name="" id="" value=""/>
            <input type="checkbox" class="chk" name="" id="" value=""/>
            <input type="checkbox" class="chk" name="" id="" value=""/>
            <input type="checkbox" class="chk" name="" id="" value=""/>
            <input type="checkbox" class="chk" name="" id="" value=""/>
            <input type="checkbox" class="chk" name="" id="" value=""/>
            <button onclick="fanxuan()">反选</button>
            <button onclick="quanxuan()">全选</button>
            <button onclick="quanbuxuan()">全不选</button>

    script代码

        function fanxuan(){
            var chk = document.getElementsByClassName("chk");
            for (var i=0;i<chk.length;i++ ) {
                if(chk[i].checked){
                    chk[i].checked = false;
                }else{
                    chk[i].checked = true;
                }
            }
        }
            function quanxuan() {
            var aa = document.getElementsByClassName('chk');
            for(var i=0; i<aa.length; i++){
            if(aa[i].name==name){
                aa[i].checked = true;
            }
        }
    }
            function quanbuxuan() {
            var bb = document.getElementsByClassName('chk');
            for(var i=0; i<bb.length; i++){
            if(bb[i].name==name){
            bb[i].checked = false;
            }
        }
    } 

    反选示例

    全选

    全不选

  • 相关阅读:
    MQTT Client软件-MQTTBox
    Eclipse
    Ant + ivy的安装
    常用消息中间件比较
    各种MQTT server功能比較
    消息中间件的对比
    RabbitMQ Performance Testing Tool 性能测试工具
    Eureka 简介
    win10 localhost 解析为::1 的解决办法
    JSP中过滤器的设置
  • 原文地址:https://www.cnblogs.com/q-1234/p/9566357.html
Copyright © 2011-2022 走看看