jQuery分頁插件jquery.pagination.js使用方法解析
jquery.pagination.js插件,此jQuery插件為Ajax分頁插件,一次性加載全部數(shù)據(jù),故分頁切換時(shí)無刷新與延遲,只是重寫指定dom元素中的html內(nèi)容,如果數(shù)據(jù)量較大不建議用此方法,因?yàn)榧虞d會(huì)比較慢;
jQuery的多數(shù)插件使用都比較簡(jiǎn)單,都能查找出相關(guān)api,且含有demo;
使用此插件,首先在頁面(jsp、html)中引入其js、css文件
<link href="/自定義路勁/jquery.pagination/pagination.css" rel="external nofollow" rel="stylesheet"> <script src="/自定義路徑/jquery.pagination/jquery.pagination.js" type="text/javascript"></script>
具體代碼:
<html> <body> <div id="table"> <div id="result"> 查詢后的數(shù)據(jù) </div> <!--分頁div,使用時(shí),只需此部分即可--> <div class="cl"> <div class="pagination" id="pageDiv"></div><!--id自定義即可--> </div> </div> <body> <script> // 創(chuàng)建分頁 $("#pageDiv").pagination(${p.totalPage}, { num_edge_entries: 1, //兩側(cè)顯示的首尾分頁的條目數(shù) num_display_entries: 4, //連續(xù)分頁主體部分顯示的分頁條目數(shù) callback: function(){//回調(diào)函數(shù), //setLinkTo();//自定義函數(shù):某種行為 }, link_to: "#",//分頁的鏈接 current_page: ${p.pageNo},//當(dāng)前頁 prev_text : "< 上一頁",//自定義“上一頁”標(biāo)簽 next_text : "下一頁 >",//自定義“下一頁”標(biāo)簽 first_text: "<i class='begin_page'>首頁</i>", //是否顯示首頁按鈕,默認(rèn)為true; last_text: "<i class='last_page'>末頁</i>", //是否顯示尾頁按鈕,默認(rèn)為true; items_per_page: ${p.pageSize}, //每頁顯示的條目數(shù)(pageSize) toPage: false //是否顯示跳轉(zhuǎn)到第幾頁,默認(rèn)是true; }); </script> </html>
由于其特有的分頁邏輯,使用此插件時(shí),需要謹(jǐn)慎,以免與應(yīng)用后臺(tái)的分頁邏輯不符,引起不必要的二次開發(fā)。
對(duì)任何插件的使用都需靈活,取你所需即可:如當(dāng)我們的應(yīng)用已經(jīng)使用了一種前端分頁插件,但是喜歡jquery.pagination插件的樣式,此時(shí),我們只需使用其樣式文件,再對(duì)原分頁插件源碼適當(dāng)?shù)恼{(diào)整即可。沒有必要推翻我們?cè)械姆猪撨壿嫞瑸榱藵M足插件而使用插件。而一定是為了滿足我們而使用插件。
更多精彩內(nèi)容請(qǐng)點(diǎn)擊:jquery分頁功能匯總進(jìn)行學(xué)習(xí)。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- jQuery Pagination Ajax分頁插件(分頁切換時(shí)無刷新與延遲)中文翻譯版
- jQuery DataTables插件自定義Ajax分頁實(shí)例解析
- jquery pagination插件實(shí)現(xiàn)無刷新分頁代碼
- jquery分頁插件jquery.pagination.js使用方法解析
- 一款Jquery 分頁插件的改造方法(服務(wù)器端分頁)
- Jquery 分頁插件之Jquery Pagination
- jQuery Pagination分頁插件使用方法詳解
- 分享一個(gè)自己動(dòng)手寫的jQuery分頁插件
- 快速掌握jquery分頁插件jqPaginator的使用方法
- jquery插件pagination實(shí)現(xiàn)無刷新ajax分頁
- jQuery插件pagination實(shí)現(xiàn)分頁特效
- jQuery插件simplePagination的使用方法示例
相關(guān)文章
jQuery實(shí)現(xiàn)美觀的多級(jí)動(dòng)畫效果菜單代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)多級(jí)動(dòng)畫效果菜單代碼,涉及jquery針對(duì)頁面元素的遍歷及事件綁定操作頁面元素樣式變換的技巧,界面美觀實(shí)用,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-09-09jQuery插件jRumble實(shí)現(xiàn)網(wǎng)頁元素抖動(dòng)
jRumble是jquery的插件,可以讓你選擇的元素抖動(dòng)。 調(diào)用時(shí)只需一句代碼即可,有些抖動(dòng)效果還挺可愛,可自定義的抖動(dòng)效果,十分的炫酷,有需要的小伙伴可以參考下。2015-06-06jQuery滾動(dòng)條插件nanoscroller使用指南
本文給大家介紹的nanoScrollerJS是一款使用簡(jiǎn)單方式實(shí)現(xiàn) Mac OS X Lion 系統(tǒng)滾動(dòng)條效果的jQuery插件。該滾動(dòng)條插件利用原生的滾動(dòng)條可以工作在 iPad、iPhone 和一些 Android Tablets上。2015-04-04淺談jQuery中的$.extend方法來擴(kuò)展JSON對(duì)象
下面小編就為大家?guī)硪黄獪\談jQuery中的$.extend方法來擴(kuò)展JSON對(duì)象。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-02-02js jquery獲取隨機(jī)生成id的服務(wù)器控件的三種方法
由于ASP.NET網(wǎng)頁運(yùn)行后,服務(wù)器控件會(huì)隨機(jī)生成客戶端id,jquery獲取時(shí)候不太好操作,下面為大家整理了三種方法,感興趣的朋友可以參考下哈,希望對(duì)大家有所幫助2013-07-07

jquery focus(fn),blur(fn)方法實(shí)例代碼