天 黑 了 2021-10-14 20:22 采纳率: 20%
浏览 31
已结题

实现checkbox 翻页后,仍保持选中状态


var checkedIds= [];//保存选中的id,亦适用于分页

        /* 将选中的数据ID保存*/
        $(function () {
            $(".dfinput1").click(function() {
                if ($(this).is(":checked")) {
                    checkedIds.push($(this).attr("id"));
                } else {
                    for (var i = 0; i < checkedIds.length; i++) {
                        if ($(this).attr("id") == checkedIds[i]) {
                            checkedIds.splice(i, 1);
                            break;
                        }
                    }
                }
            })
            var boxes = document.getElementsByClassName("dfinput1")
            console.log(boxes)
            for(var i=0;i<boxes.length;i++){
                var id = boxes[i].id;
                //console.log(id)
                //console.log(checkedIds.indexOf(id,0)!=-1)
                if(checkedIds.indexOf(id,0)!=-1){
                    boxes[i].checked = true;
                }else{
                    boxes[i].checked = false;
                }
            }
        })
        //console.log(checkedIds)


        //翻页后设置是否选中
        function setChecked(){
            console.log(checkedIds)
            var boxes = document.getElementsByClassName("dfinput1")
            console.log(boxes)
            for(var i=0;i<boxes.length;i++){
                var id = boxes[i].id;
                //console.log(id)
                //console.log(checkedIds.indexOf(id,0)!=-1)
                if(checkedIds.indexOf(id,0)!=-1){
                    boxes[i].checked = true;
                }else{
                    boxes[i].checked = false;
                }
            }
        }

<table class="tablelist">
                <thead>
                <tr>
                    <th>课程编号</th>
                    <th>课程名称</th>
                    <th><input type="checkbox" class="dfinput-all">全选</th>
                </tr>
                </thead>
                <tbody>
                <s:iterator value="pageResult1.data">
                    <tr>
                        <td>${curriculumId}</td>
                        <td>${courseName}</td>
                        <td><input name="curriculumId" id="curriculumId_${curriculumId}" type="checkbox" class="dfinput1" value="${curriculumId}" ></td>
                    </tr>
                </s:iterator>
                </tbody>
            </table>

为什么不能分页保存选中状态,请问是哪里出了问题,有人教一下嘛

  • 写回答

0条回答 默认 最新

    报告相同问题?

    问题事件

    • 系统已结题 10月22日
    • 创建了问题 10月14日