1. 程式人生 > >layui 工具條實現分頁

layui 工具條實現分頁

1.頁面 
<div id="getShowTable" style="width: 100%; height: auto;clear: both;"></div>
2.js
//請求後臺返回頁面
function lodPage(page, limit,key) {
        //請求資料
        $.ajax({
            type: "post",
            url: gContextPath + "/wantReturnBid/wantReturnBidList.htm",
            data: {
                
"page": page, "limit": limit,"key":key }, dataType: "html", success: function (data) { $("#getShowTable").html(data); } }); }
3.請求返回的頁面加
//分頁工具條
<div id="page_dv" style="text-align: center;"></div>    
//js
 layui.use(['laypage', 'layer'], function
() { var laypage = layui.laypage , layer = layui.layer; var current =${page.count}; //分頁 laypage.render({ elem: 'page_dv' , count: current //資料總數 , curr: '${page.page}' , limit: 10 , groups: 10 , layout: [
'count', 'prev', 'page', 'next', 'refresh', 'skip'] , jump: function (obj, first) { if (!first) { var key = $(".js_invite_serach_key").val()||""; lodPage(obj.curr, obj.limit,key); } } }); //回標 $(document).on("click",".js_return_bid",function(){ var _th = $(this); var _rel = _th.attr("rel"); window.location.href=gContextPath+"/wantReturnBid/wantReturnBidEdit.htm?planId="+_rel; }); })