温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

jquery-实现全选与不全选

发布时间:2020-06-28 06:26:16 来源:网络 阅读:409 作者:素颜猪 栏目:web开发

jquery代码:

省略引用jquery代码。

<script type="text/javascript">

//全选
    $(function() {
        $("#selectAll").click(function() {
            if (this.checked) {
                $("#chapterlist :checkbox").each(function() {
                    this.checked = true;
                });
                $("#selectAll").attr("value", "反选");
            } else {
                $("#chapterlist :checkbox").each(function() {
                    this.checked = false;
                });
                $("#selectAll").attr("value", "全选");
            }
        });

        //设置全选复选框
        $("#chapterlist :checkbox[name!=all]").click(function() {
            allchk();
        });

        function allchk() {
            var objs = $("#chapterlist :checkbox[name!=all]");
            var chknum = objs.size();//选项总个数
            var chk = 0;
            objs.each(function(index, o) {
                if ($(o).is(":checked")) {
                    chk++;
                }
            });
            if (chknum == chk) {//全选
                $("#selectAll").attr("checked", true);
            } else {//不全选
                $("#selectAll").attr("checked", false);
            }
        }

    });
</script>
主体内容:
<table class="content" border="0" id="chapterlist">
                    <tr style="font-weight: bold;" class="listfirst">
                        <td width="10%">
                            <s:checkbox id="selectAll" fieldValue="" name="all"
                                onclick="selectAll()"></s:checkbox>
                            全选
                        </td>
                    </tr>
                    <s:iterator value="recordList" status="status">
                        <tr class="listcontetn">
                            <td width="10%">
                                <s:checkbox fieldValue="%{chapterId}" name="chapterIds"></s:checkbox>
                            </td>
                        </tr>
                    </s:iterator>
                </table>

jquery-实现全选与不全选

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI