一、相關(guān)demo
本文地址： http://www.zhangxinxu.com/wordpress/?p=616
本文作者為：張鑫旭 來源于：張鑫旭-鑫空間-鑫生活 歡迎訪問原出處
二、簡介與說明
- 此jQuery插件為Ajax分頁插件，一次性加載，故分頁切換時無刷新與延遲，如果數(shù)據(jù)量較大不建議用此方法，因為加載會比較慢。
- 原插件CSS不太合理，使用浮動，故無法方便實現(xiàn)左右方向的定位，且未清除浮動，在中文修改版中我對其進(jìn)行了優(yōu)化，使其支持text-align的定位。
- 對原js文件注釋進(jìn)行了中文翻譯，demo頁面也是漢化了的，demo頁面的js與原demo有一些出入，但核心不變。
本文地址： http://www.zhangxinxu.com/wordpress/?p=616
本文作者為：張鑫旭 來源于：張鑫旭-鑫空間-鑫生活 歡迎訪問原出處
三、使用方法
跟一般的jQuery插件一樣，此插件使用也很簡單便捷。方法是pagination，例如$("#page").pagination(100);，這里的100參數(shù)是必須的，表示顯示項目的總個數(shù)，這是最簡單的使用，得到的顯示如下：
還有一點值得一提的是分頁列表需要放在class類為pagination的標(biāo)簽內(nèi)，您可以使用text-align屬性控制分頁居中顯示還是居右顯示。
回調(diào)函數(shù)一般用來裝載對應(yīng)分頁顯示的內(nèi)容，具體參見demo源文件。
本文地址： http://www.zhangxinxu.com/wordpress/?p=616
本文作者為：張鑫旭 來源于：張鑫旭-鑫空間-鑫生活 歡迎訪問原出處
四、參數(shù)
| 參數(shù)名 | 描述 | 參數(shù)值 |
| maxentries |
總條目數(shù) |
必選參數(shù)，整數(shù) |
| items_per_page |
每頁顯示的條目數(shù) |
可選參數(shù)，默認(rèn)是10 |
| num_display_entries |
連續(xù)分頁主體部分顯示的分頁條目數(shù) |
可選參數(shù)，默認(rèn)是10 |
| current_page |
當(dāng)前選中的頁面 |
可選參數(shù)，默認(rèn)是0，表示第1頁 |
| num_edge_entries |
兩側(cè)顯示的首尾分頁的條目數(shù) |
可選參數(shù)，默認(rèn)是0 |
| link_to |
分頁的鏈接 |
字符串，可選參數(shù)，默認(rèn)是"#" |
| prev_text |
“前一頁”分頁按鈕上顯示的文字 |
字符串參數(shù)，可選，默認(rèn)是"Prev" |
| next_text |
“下一頁”分頁按鈕上顯示的文字 |
字符串參數(shù)，可選，默認(rèn)是"Next" |
| ellipse_text |
省略的頁數(shù)用什么文字表示 |
可選字符串參數(shù)，默認(rèn)是"…" |
| prev_show_always |
是否顯示“前一頁”分頁按鈕 |
布爾型，可選參數(shù)，默認(rèn)為true，即顯示“前一頁”按鈕 |
| next_show_always |
是否顯示“下一頁”分頁按鈕 |
布爾型，可選參數(shù)，默認(rèn)為true，即顯示“下一頁”按鈕 |
| callback |
回調(diào)函數(shù) |
默認(rèn)無執(zhí)行效果 |
本文地址： http://www.zhangxinxu.com/wordpress/?p=616
本文作者為：張鑫旭 來源于：張鑫旭-鑫空間-鑫生活 歡迎訪問原出處
五、使用舉例
例如下面的使用代碼：
$("#Pagination").pagination(56, {
num_edge_entries: 2,
num_display_entries: 4,
callback: pageselectCallback,
items_per_page:1
});
這段代碼表示的含義是：總共有56(maxentries)個列表項，首尾兩側(cè)分頁顯示2(num_edge_entries)個，連續(xù)分頁主體數(shù) 目顯示4(num_display_entries)個，回調(diào)函數(shù)為pageselectCallback(callback)，每頁顯示的列表項為 1(items_per_page)。您可以對照參數(shù)表修改配置這里的參數(shù)。
本文地址： http://www.zhangxinxu.com/wordpress/?p=616
本文作者為：張鑫旭 來源于：張鑫旭-鑫空間-鑫生活 歡迎訪問
六、關(guān)于demo的一些說明
總共有三個demo，第一個demo就是個靜態(tài)的數(shù)據(jù)，直接寫在HTML上；第二個使用Ajax加載HTML數(shù)據(jù)，然后進(jìn)行分頁顯示；第三個demo可以動態(tài)修改一些參數(shù)觀察對應(yīng)的分頁效果。
所有demo頁面的js注釋我都改為了中文標(biāo)注，難點在于回調(diào)函數(shù)，demo中回調(diào)函數(shù)有兩個參數(shù)，一個是page_index，另一個是jq，前 一個表示您當(dāng)前點擊的那個分頁的頁數(shù)索引值，后一個參數(shù)表示裝載容器。這里的頁數(shù)索引值是關(guān)鍵，我們要根據(jù)這個索引值找到對應(yīng)的（例如）HTML元素，然 后再指定的容器中顯示出來，demo中提供了裝載單元素以及多元素的方法，相信不會有太大問題。
