服务端做分页，分页多选，数据回显，动态修改

参考思路    http://blog.csdn.net/lxhjava/article/details/54633829

<script type="text/javascript">
   $(document).ready(function() {
        var checkedIds = parent.$("#checkedIds").val();//获取父页面数据
        if(checkedIds.length != 0){     //判断如果为空跳过
            var ids = new Array(); //定义一数组
            ids = checkedIds.split(";");
            for(var i in ids){
                if(ids[i].length == 0){
                    continue ;
                }
                var arr = JSON.parse(ids[i]);
                $("#"+arr.id).attr("checked", true);
                $("#"+arr.id).parent().next().find('input').val(arr.inDis);     //赋值
                $("#"+arr.id).parent().next().next().find('input').val(arr.number);
            }
        }
   });
  
</script>

<script>
    //跨页多选
    function updateCheckedIds(box){
        //获得当前复选框的值
        var id=box.value;
        var inDis = $(box).parent().next().find('input').val();
        var number = $(box).parent().next().next().find('input').val();
        var arr = {
            'id' : id,
            'inDis' : inDis,
            'number' : number
        }
        //历史所选的id,多个id以";"分隔
        var checkedIds = parent.$('#checkedIds').val(); //获取父页面数据
        if(box.checked){//勾选
            checkedIds += JSON.stringify(arr)+";";//历史用没有则追加
            parent.$('#checkedIds').val(checkedIds);
        }else{//取消勾选
            var ids = new Array(); //定义一数组
            ids = checkedIds.split(";");
            var a = "";
            for(var i in ids){   //遍历数组
                if(ids[i].length == 0){
                    continue ;
                }
                var old = JSON.parse(ids[i]);   //字符串转换为json对象(数组)
                if(id != old.id ){   //不存在
                    a += JSON.stringify(old)+";";
                } else {
                    $(box).parent().next().find('input').val("");
                    $(box).parent().next().next().find('input').val("");
                }
            }
            parent.$('#checkedIds').val(a);   //修改完成保存返回
        }
    }
    //折扣焦点事件（动态变更数据）
    function inDisAnd (box){
        var inDis = box.value;      //已经修改的值
        var id = $(box).parent().prev().find('input').val();     //得到该对象id
        var checkedIds = parent.$("#checkedIds").val();     //获取父页面数据
        if(checkedIds.length == 0){     //判断如果为空跳过
            return ;
        }
        var ids = new Array(); //定义一数组
        ids = checkedIds.split(";");
        var a = "" ;
        for(var i in ids){
            if(ids[i].length == 0){
                continue ;
            }
            var arr = JSON.parse(ids[i]);
            if(id == arr.id ){
                arr.inDis = inDis ;
            }
            a += JSON.stringify(arr)+";";
        }
        parent.$('#checkedIds').val(a);   //修改完成保存返回
    }
    //数量焦点事件（动态变更数据）
    function numberAnd (box){
        var number = box.value;      //已经修改的值
        var id = $(box).parent().prev().prev().find('input').val();     //得到该对象id
        var checkedIds = parent.$("#checkedIds").val();     //获取父页面数据
        if(checkedIds.length == 0){     //判断如果为空跳过
            return ;
        }
        var ids = new Array(); //定义一数组
        ids = checkedIds.split(";");
        var a = "" ;
        for(var i in ids){
            if(ids[i].length == 0){
                continue ;
            }
            var arr = JSON.parse(ids[i]);
            if(id == arr.id ){
                arr.number = number ;
            }
            a += JSON.stringify(arr)+";";
        }
        parent.$('#checkedIds').val(a);   //修改完成保存返回
    }
    //查看已选(相当于排序)
//    function showSelect() {
//        var checkedIds = parent.$("#checkedIds").val();     //获取父页面数据
//    }
    /*关闭弹出框口*/
    function layer_close() {
        var index = parent.layer.getFrameIndex(window.name);
        parent.layer.close(index);
    }
</script>

<tbody>
   <c:forEach items="${page.list}" var="teachingMaterial">
      <tr>
         <td><input type="checkbox" id="${teachingMaterial.id}" value="${teachingMaterial.id}"
                name="id[]" onclick="updateCheckedIds(this)" class="checkboxs"/>
                  </td>
         <td id="inDis"><input style="width:80%;" onblur="inDisAnd(this)" /></td>
         <td id="number"><input  style="width:80%;" onblur="numberAnd(this)"/></td>
         <td>${teachingMaterial.name}</td>
         <td>${teachingMaterial.versionOf}</td>
         <td>${teachingMaterial.price}</td>
         <td>${teachingMaterial.sort}</td>
         <td>${teachingMaterial.printing}</td>
         <td>${teachingMaterial.code}</td>
         <td>${teachingMaterial.isbn}</td>
      </tr>
   </c:forEach>