一個簡單的jQuery分頁插件,相容於AMD規格和requireJS.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 |
|
CSS
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 |
|
jquery分頁外掛cypager
cypager是網友分享到JquerySchool網站上的一款作品,非常實用,經過測試,插件相容於 IE8 ,Chrome,Firefox 瀏覽器,核心檔案僅 5KB。 。 。
呼叫方式
由於是 jquery插件,所以在引人 cypager.min.js 之前,要引人 jquery.min.js 本人使用的是 1.7.2 版本的,低版本的沒試過。
引入css :
引人js :
$(function(){ $("#pagerArea").cypager({pg_size:10,pg_nav_count:8,pg_total_count:194,pg_call_fun:function(count){ alert("跳转至页面:"+count+""); }}); });
參數說明
pgerId //插件的ID 預設 : cy_pager
pg_size //每頁顯示記錄數 預設:10筆
pg_cur_count //目前頁數(如果需要預設顯示指定頁面,則設定)
pg_total_count //總記錄數
pg_nav_count //顯示幾個導覽數 預設:7個
pg_prev_name //上一頁按鈕名稱(預設:PREV)
pg_next_name //下一頁按鈕名稱 (預設:NEXT)
pg_call_fun(page_count) //回呼函數,點選按鈕執行
高效率JQUERY分頁外掛程式原始碼JQUERY.PAGER.JS
本文將給大家分享一個非常不錯的分頁插件、jQuery.pager.js、該插件的優點是可以內容索引、使用了jQuery、也同時調用了jquery.pager.js檔案、分頁都是基於Ajax的、當然、如果你不打算使用Ajax來實現分頁的話、那麼你最好不要使用本插件、若使用的話反而很麻煩、本插件主要是為使用Ajax技術交互的網站所準備、可以很方便的嵌入到網站系統中、實現Ajax分頁功能、如果大家覺得這個效果不是很好看的話、可以自己重寫分頁按鈕的樣式哈
HTML程式碼很簡單、只要準備一個用於分頁程式碼的DIV就可以了
<div class="tcdPageCode"></div>
透過jQuery的方式呼叫即可
$(".tcdPageCode").createPage({ pageCount:6, current:1, backFn:function(p){ console.log(p); } });