• 全选、全不选和反选


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>全选反选</title>
    </head>
    <body>
      <input id="btn1" type="button" value="全选" />
      <input id="btn2" type="button" value="不选" />
      <input id="btn3" type="button" value="反选" /><br><br>
      <div id="div1">
        <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>
    <script>

      var oBtn1=document.getElementById('btn1');
      var oBtn2=document.getElementById('btn2');
      var oBtn3=document.getElementById('btn3');
      var oDiv=document.getElementById('div1');
      var allCheckbox=oDiv.getElementsByTagName('input');
      oBtn1.onclick=function(){

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

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

        for (var i=0;i<allCheckbox.length;i++){
          if(allCheckbox[i].checked==true){
            allCheckbox[i].checked=false;
          }else{
            allCheckbox[i].checked=true;
          }
        }
      };
    </script>

  • 相关阅读:
    Hibernate>查询缓存 小强斋
    hibernate>抓取策略 小强斋
    Spring>环境 及 为什么使用spring 小强斋
    Hibernate>一级缓存 小强斋
    Spring>环境 及 为什么使用spring 小强斋
    【设计模式系列】OO设计原则之LSPLiskov替换原则
    【设计模式系列】OO设计原则之SRP单一职责原则
    【Android】选项卡使用
    【人生】不管你挣多少, 钱永远是问题
    【设计模式系列】序
  • 原文地址:https://www.cnblogs.com/DellHome/p/5072540.html
Copyright © 2020-2023  润新知