layui的laypage分页插件使用

window.onload= function () {

        loadData()  //请求数据
        getPage()     //分页操作
    }
    var page=1; //设置首页页码
    var limit=2;  //设置一页显示的条数
    var total;    //总条数


    function loadData(){
        $.ajax({
            type:"post",
            url:"/it/orderManage/getOrderList",//对应controller的URL
            async:false,
            dataType: 'json',
            data:{
                "pageIndex":page,
                "pageSize":limit,
            },
            success:function(ret){
                total=ret.total;  //设置总条数
                console.log(ret);
                var data1=ret.rows;
                var html='';
                for(var i=0;i<data1.length;i++){
                    html+='<dl>';
                    html+=' <dt>';
                    html+='     <span class="s1">'+data1[i].CREATE_TIME+'</span>';
                    html+='     <span class="s2">'+data1[i].STAGE_NAME+'</span>';
                    html+=' </dt>';
                    html+=' <dd class="d1">';
                    html+='     价格：<span>￥'+data1[i].REWARD_FEE+'</span>';
                    html+=' </dd>';
                    html+=' <dd class="d1">';
                    html+='     名称：<span>'+data1[i].ORDER_NAME+'</span>';
                    html+=' </dd>';
                    html+=' <dd class="d1">';
                    html+='     人数：<span>'+data1[i].TAKE_NUM+'人参与</span>';
                    html+=' </dd>';
                    html+=' <dd class="d1">';
                    html+='     时间：<span>'+data1[i].START_DATE+'点 -- '+data1[i].END_DATE+'点</span>';
                    html+=' </dd>';
                    html+='</dl>';

                }
                console.log(html)
                $(".orderList").empty().append(html);

            }
        });
    }


    function getPage(){
        layui.use('laypage', function(){
            var laypage = layui.laypage;

            //执行一个laypage实例
            laypage.render({
                elem: 'laypage' //注意，这里的 test1 是 ID，不用加 # 号
                ,count: total, //数据总数，从服务端得到
                limit:limit,   //每页条数设置
                jump: function(obj, first){
                    //obj包含了当前分页的所有参数，比如：
                    console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
                    console.log(obj.limit); //得到每页显示的条数
                    page=obj.curr;  //改变当前页码
                    limit=obj.limit;
                    //首次不执行
                    if(!first){
                        loadData()  //加载数据
                    }
                }
            });
        });
    }

以上是前台js，后台配合对应的分页插件就可以实现分页效果了。我用的是mybatis的pageHelper