需求分析

1)需要首頁，末頁功能

2)有點擊查看上一頁，下一頁功能

3)頁碼到當前可視頁碼最后一頁刷新頁面

實現(xiàn)思路

也是分為三部分處理

1)點擊首頁，末頁直接顯示第一頁或者最后一頁內容，當前頁面為第1頁或者最后一頁。隱藏首頁或者末頁按鈕。demo 顯示截圖

首頁狀態(tài) 和 末頁狀態(tài)代碼執(zhí)行結果截圖

2)點擊可視頁碼截圖

3)點擊上一頁或者下一頁，，需要刷新頁碼狀態(tài)時截圖，昨天表示當前頁碼為7，右圖是點擊上一頁，刷新頁碼時的狀態(tài)

代碼參數(shù)說明

/* 初始化頁面 */

var initTotalPageNum = 11;

$("#ui-page").paging({pageSize:5,totalPage:initTotalPageNum});

為了區(qū)分清楚，所以把每一個文件都分開寫了。

data.js 　　　　　　　　　　　　　　//是用json模擬的后臺數(shù)據.

sendAjax.js 　　　　　　　　　　　　//是模擬的ajax請求后臺數(shù)據的文件

page.js 　　　　　　　　　　　　　　//是封裝的生成頁碼的功能

initTotalPageNum　　　　　　　　//模擬的后臺傳入的數(shù)據總頁碼

pageSize　　　　　　　　　　　　//自定義參數(shù)，可以定義可視區(qū)域代碼,當前demo。pageSize = 5,initTotalPageNum=3 小于pageSize 的時候，顯示狀態(tài)如下圖所示

代碼優(yōu)缺點

1)使用ajax可以實現(xiàn)局部刷新，但是不利于seo

2) 生成頁碼沒有改變dom結構，只變化頁碼

最近項目中的需求，自己寫的一個。有時間的話會用js實現(xiàn)一遍。

有需要的話，完整demo ，點此下載

總結

以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對我們的支持。

時間： 2017-03-31

總結

以上是生活随笔為你收集整理的java ajax实现分页代码,jQuery实现分页功能（含ajax请求、后台数据、附完整demo）...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。