zoukankan      html  css  js  c++  java
  • html全选和取消全选JS

    <html>  
    <body>  
      
        <table border="1">  
            <tr>  
                <th><input type="checkbox" onclick="swapCheck()" /></th>  
                <th>Month</th>  
                <th>Savings</th>  
            </tr>  
            <tr>  
                <td><input type="checkbox" /></td>  
                <td>January</td>  
                <td>$100</td>  
            </tr>  
            <tr>  
                <td><input type="checkbox" /></td>  
                <td>February</td>  
                <td>$150</td>  
            </tr>  
        </table>  
      
        <script type="text/javascript"  
            src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>  
      
        <script type="text/javascript">  
            //checkbox 全选/取消全选  
            var isCheckAll = false;  
            function swapCheck() {  
                if (isCheckAll) {  
                    $("input[type='checkbox']").each(function() {  
                        this.checked = false;  
                    });  
                    isCheckAll = false;  
                } else {  
                    $("input[type='checkbox']").each(function() {  
                        this.checked = true;  
                    });  
                    isCheckAll = true;  
                }  
            }  
        </script>  
      
    </body>  
    </html> 
    

     效果图:

  • 相关阅读:
    第二次作业
    第一次作业
    第五次作业
    第四次作业
    第三次作业
    第二次作业
    第一次作业
    HTML标签分类
    HTML属性与事件的搭配使用
    HTML全局属性和全局事件属性
  • 原文地址:https://www.cnblogs.com/sincoolvip/p/6346591.html
Copyright © 2011-2022 走看看