預設載入資料分頁,點選分頁後再次非同步資料

2022-02-12 12:12:48 字數 1458 閱讀 2259

現在主流的分頁外掛程式很多是一次性把資料載入完成,再本地分頁,切換時候是tab效果,資料量大or網路不通暢的時候,就會很卡影響載入效果。

實現每頁載入固定條數及點選分頁再次請求資料,假設共100條資料,一頁10條的話共10頁。需要後端配合每頁顯示全部的條數及每頁條數。

根據pagenum=1查詢,返回json資料

count資料總數

pagenum 第一頁

pagesize 每頁10條

分頁**:

function(e) 

s.prototype =

}, e.fn.paging = function(n, a, t) );

var o = '首頁',

l = '末頁',

d = "";

if (i.spannumber <= i.maxspannumber) else

e('span[pagenumer="1"]').addclass("current");

var c = r.children('span[pageindex="backward"]'),

m = r.children('span[pageindex="forward"]'),

h = r.children("span[pagenumer]");

r.delegate("span", "click", function()

r.attr("activepage", r.children(".current").index() - 1), t && t(e(this).attr("pageindex"))

})}}(jquery),

非同步資料

var basemodule = 

},error: function(e)

});}

}

呼叫

//預設載入取得資料

basemodule.loadajax(url, "get", , listscallback);

//傳入資料 顯示分頁

function listscallback(d)

//分頁點選後 再非同步資料

function refreshlists(i)

if(data.pagenum === i)

data.pagenum = i;

basemodule.loadajax(url, "get", , showlists);

}//傳入資料 插入頁面

function showlists(o)

pagesize = o.data.pagesize;//覆蓋每頁條數

pagecount = o.data.count;//覆蓋總條數

//操作

});}

js滾動分頁載入資料

實現理念 1.判斷滾動條到底部觸發載入函式 2.請求資料 3.追加資料 html 21.90 價 24.90元 努力載入中.js 分頁載入 function 請求頁數 success function res var imgwidth list flex son img width list fle...

分頁載入資料效果的新穎改進

先說說網頁為什麼要分頁 1,使用者體驗考慮 使使用者集中注意力瀏覽當前頁面內容,而不是給出十幾屏資料,時瀏覽者無所適從,產生壓迫感 厭倦感 焦慮感 分頁使頁面短小 完全可以把內容限制在一屏大小的面積內 容易布局,也增強了瀏覽者視覺感受。也是因為頁面短小,所以載入快速。2,技術原因 但最近有一種能完成...

WinForm程式虛擬分頁 實時載入資料

windows應用程式中很少見有分頁的程式 資料夾中有上萬個檔案的時候微軟也沒讓使用者來翻頁檢視列表 記事本中的文字,某個系統功能的列表也都沒有分頁。word文件是個例外 知道web中的分頁是怎麼做出來的朋友一定知道winform做分頁會更簡單 winform程式一樣也不允許使用者一下子把資料庫中上...