zoukankan      html  css  js  c++  java
  • JQ实现全选、全不选

    代码:

       <table class="table myTable table-hover">
            <thead>
            <tr>
                <th>
                    <div class="el-checkbox el-checkbox-green allCheck">
                        <label class="el-checkbox el-checkbox"><input type="checkbox" title="全选">
                            <span class="el-checkbox-style pull-right"></span>
                        </label>
                    </div>
                </th>
            </tr>
            </thead>
            <tbody class="case_list">
            <tr>
                <td>
                    <div class="el-checkbox el-checkbox-yellow">
                        <label class="el-checkbox el-checkbox">
                            <span class="margin-r"></span>
                            <input type="checkbox" value="">
                            <span class="el-checkbox-style pull-right"></span>
                        </label>
                    </div>
                </td>
            </tr>
            <tr>
                <td>
                    <div class="el-checkbox el-checkbox-yellow">
                        <label class="el-checkbox el-checkbox">
                            <span class="margin-r"></span>
                            <input type="checkbox" value="">
                            <span class="el-checkbox-style pull-right"></span>
                        </label>
                    </div>
                </td>
            </tr>
            </tbody>
        </table>

    jq代码:

     // 全选,取消
            $('.allCheck :checkbox').change(function () {
                // 当全选按钮被选中时,勾选列表中的所有的
                if ($(this).prop('checked')) {
                    $('.case_list :checkbox').prop('checked', true);
                } else {
                    // 当再次点击全选按钮,表示取消全选
                    $('.case_list :checked').prop('checked', false)
                }
            });
  • 相关阅读:
    ●单例模式
    ●扩展方法
    ●存储过程比sql语句慢
    ●rownum() over()
    ●日期格式化
    ●sql优化
    VS建立Web网站 20141201
    ORM操作(一) 20141128
    流的操作20141104
    控件:菜单、工具栏、状态栏及TreeView的操作 20141103
  • 原文地址:https://www.cnblogs.com/wanghuijie1/p/11859335.html
Copyright © 2011-2022 走看看