zoukankan      html  css  js  c++  java
  • 使用js实现复选框的全选、取消功能

    id为all的想设置全选的那个框的id,name为checkname[]的是每个小复选框;

    第一种:

    <script>
    
        function checkAll() {
    
            var all=document.getElementById('all');//获取到点击全选的那个复选框的id
    
            var one=document.getElementsByName('checkname[]');//获取到复选框的名称
    
            if(all.checked==true){//因为获得的是数组,所以要循环 为每一个checked赋值
    
                for(var i=0;i<one.length;i++){
    
                    one[i].checked=true;
    
                }
    
     
    
            }else{
    
                for(var j=0;j<one.length;j++){
    
                    one[j].checked=false;
    
                }
    
            }
    
        }
    
    </script>

    第二种:

    <span style="font-size:14px;"><script>
    
    function checkAll() {
    
    var all=document.getElementById('all');//获取到点击全选的那个复选框的id
    
    var one=document.getElementsByName('checkname[]');//获取到复选框的名称
    
    //因为获得的是数组,所以要循环 为每一个checked赋值
    
    for(var i=0;i<one.length;i++){
    
    one[i].checked=all.checked; //直接赋值不就行了嘛
    
    }
    
    }
    
    </script></span>

    html代码:

        <thead>
    
        <tr>
    
            <td><input type="checkbox" name="all" id="all" onclick="checkAll()" /></td>
    
        </tr>
    
        </thead>
    
        <tbody>
    
        <td><input type="checkbox" name="checkname[]"value="1"/></td>
    
     
    
     
    
        <td><input type="checkbox" name="checkname[]" value="2"/></td>
    
     
    
        <td><input type="checkbox" name="checkname[]" value="3"/></td>
    
     
    
        <td><input type="checkbox" name="checkname[]" value="4"/></td>
    
     
    
        <td><input type="checkbox" name="checkname[]" value="5"/></td>
    
        </tbody>
  • 相关阅读:
    poj1580
    poj1607
    poj1313
    poj1314
    c语言之extern和static
    C笔记(一)
    搭建Linux高可用性集群(第一天)
    利用回调函数实现泛型算法
    关于SQL server中的 identity
    SQL(一)
  • 原文地址:https://www.cnblogs.com/wuxu/p/10728618.html
Copyright © 2011-2022 走看看