這是jquery分頁(yè)插件dataTables下載,jquery 中的一款分頁(yè)插件,可以簡(jiǎn)單的實(shí)現(xiàn)分頁(yè)效果-The a paging jquery add-on, simple implementation paging effect。
jquery分頁(yè)插件dataTables是 一個(gè)簡(jiǎn)單的例子 讓你快速上手 很多分頁(yè)插件都是基于此插件做的 可以說(shuō)算是原生的 某些情境下 pagination 不可多得 僅此而已。
園友是做前端的,產(chǎn)品經(jīng)理要求他使用jQuery DataTables插件顯示一個(gè)列表,要實(shí)現(xiàn)分類效果。
后端的分頁(yè)接口已經(jīng)寫好了,不涉及條件查詢,需要傳入頁(yè)碼(pageNo)和頁(yè)面顯示數(shù)據(jù)條數(shù)(pageSize),顯示相應(yīng)頁(yè)的顯示記錄,且不能修改后端接口。
先來(lái)分析下分頁(yè)實(shí)現(xiàn)。
一是后端分頁(yè):這種情況下,在后端很容易實(shí)現(xiàn),在官網(wǎng)上有示例,不多說(shuō)明。
二是前端分頁(yè):前端分頁(yè)也是支持的,不過(guò)需要一次把所有數(shù)據(jù)都獲取到才可以。
看到這里,問(wèn)題來(lái)了。由于后端在目前的情況下是更改不了,只能在前端實(shí)現(xiàn)。但是,現(xiàn)在又不滿足前端分頁(yè)的條件:一次性獲取所有數(shù)據(jù)(現(xiàn)在后端數(shù)據(jù)接口只能返回相應(yīng)頁(yè)碼的數(shù)據(jù))。
介于目前的情況,獲取的數(shù)據(jù)只有一頁(yè),沒(méi)有所有的頁(yè)碼。