本文主要是介绍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的URLasync: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() //加载数据}}});});}
这篇关于Layui的laypage分页插件使用的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
