• checkbox 全选操作


     1 <html>
     2 <head></head>
     3 <body>
     4  <div id="places">
     5    <input type="checkbox" name="chx" value="1" onclick="_check_status(this)"/>香港
     6    <input type="checkbox" name="chx" value="2" onclick="_check_status(this)"/>澳门
     7    <input type="checkbox" name="chx" value="3" onclick="_check_status(this)"/>深圳
     8    <input type="checkbox" name="chx" value="4" onclick="_check_status(this)"/>台北
     9    <input type="checkbox" name="chx" value="5" onclick="_check_status(this)"/>乌镇
    10  </div>
    11  
    12  <div id="allplaces">
    13     <input type="checkbox" id="checkall" name="chx" value="0" onclick="_check_all(this)"/>全选
    14  </div>
    15  </body>
    16  <script>
    17      //点击“全选”, 所有地方都选上
    18      function _check_all(obj)
    19      {     
    20         var nodes = document.getElementById("places").childNodes;              
    21         if(obj.checked)
    22         {          
    23             for (var i=0; i < nodes.length; i++)
    24             {        
    25                if(nodes[i].type == "checkbox")
    26                {
    27                    nodes[i].checked = true;       
    28                }          
    29             }                          
    30         }
    31         else
    32         {
    33             for (var i=0; i < nodes.length; i++)
    34             {        
    35                if(nodes[i].type == "checkbox")
    36                {
    37                    nodes[i].checked = false;       
    38                }          
    39             }        
    40         } 
    41      }
    42      
    43      //每一个checkbox的状态校验
    44      function _check_status(obj)
    45      {
    46         var nodes = document.getElementById("places").childNodes; 
    47         if(obj.checked)
    48         {
    49             for (var i=0; i < nodes.length; i++)
    50             {        
    51                if((nodes[i].type == "checkbox") &&  !nodes[i].checked)
    52                {
    53                     document.getElementById("checkall").checked = false; 
    54                     return;                   
    55                }          
    56             }
    57             
    58             document.getElementById("checkall").checked = true; 
    59         }
    60         else
    61         {
    62             document.getElementById("checkall").checked = false;
    63         }
    64      }
    65          
    66  </script>
    67 </html>
  • 相关阅读:
    Hibernate sqlserver 的对象转成 Hibernate mysql 的对象时 需注意
    将绿色版Tomcat服务添加到系统服务并设为开机运行
    进程上下文和中断上下文
    关于上、下拉电阻的总结整理
    I2C设备驱动流程
    MTK6573的LDO控制
    iomem—I/O映射方式的I/O端口和内存映射方式的I/O端口
    Linux I2C子系统分析I2C总线驱动
    Camera读取ID方法总结
    Linux 信号signal处理机制
  • 原文地址:https://www.cnblogs.com/yiliweichinasoft/p/3886795.html
Copyright © 2020-2023  润新知