• jq实现批量全选与反选


    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>
    
        <input type="button" value="删除">
        <table border=1>
            <thead>
                <tr>
                    <th><input type="checkbox"></th>
                    <th>2</th>
                    <th>3</th>
                    <th>4</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><input type="checkbox"></td>
                    <td>打两份工</td>
                    <td>真的很高</td>
                    <td><button>删除</button></td>
                </tr>
                <tr>
                    <td><input type="checkbox"></td>
                    <td>打两份工</td>
                    <td>真的很高</td>
                    <td><button>删除</button></td>
                </tr>
                <tr>
                    <td><input type="checkbox"></td>
                    <td>打两份工</td>
                    <td>真的很高</td>
                    <td><button>删除</button></td>
                </tr>
                <tr>
                    <td><input type="checkbox"></td>
                    <td>打两份工</td>
                    <td>真的很高</td>
                    <td><button>删除</button></td>
                </tr>
                <tr>
                    <td><input type="checkbox"></td>
                    <td>打两份工</td>
                    <td>真的很高</td>
                    <td><button>删除</button></td>
                </tr>
                <tr>
                    <td><input type="checkbox"></td>
                    <td>打两份工</td>
                    <td>真的很高</td>
                    <td><button>删除</button></td>
                </tr>
            </tbody>
        </table>
    </body>
    <script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
    
    <script>
        $(function(){
            $("input[type=button]").click(function(){
                $("tbody").find("input:checkbox:checked").each(function() { // 遍历选中的checkbox
                    n = $(this).parents("tr").index();  // 获取checkbox所在行的顺序
                    $("tbody").find("tr:eq("+n+")").remove();
                });
            });
        });
        $(function(){
            $("thead").find("input[type=checkbox]").click(function(){
                var flag = $(this).prop("checked"); 
                $("tbody").find("input[type=checkbox]").each(function() { // 遍历选中的checkbox
                    $(this).prop("checked",flag);
                });
            });
        });
    </script>
    
    </html>
  • 相关阅读:
    sqlite3经常使用命令&amp;语法
    DataTable.AcceptChanges方法有何用处
    C面试题
    keil程序在外部RAM中调试的问题总结(个人的一点经验总结)
    jps命令
    【C++基础】类的组合
    《算法导论》为什么经典
    Spring3.0 AOP 具体解释
    Java中StringBuilder的清空方法比較
    TFS(Team Foundation Server)介绍和入门
  • 原文地址:https://www.cnblogs.com/zwhbk/p/8680972.html
Copyright © 2020-2023  润新知