原项目地址:http://plugins.jquery.com/project/pagination
版本:v1.2
源文件下载:英文原版 或中文翻译修改版
一、相关demo
跟一般的jQuery插件一样,此插件使用也很简单便捷。方法是pagination
,例如$("#page").pagination(100);
,这里的100参数是必须的,表示显示项目的总个数,这是最简单的使用,得到的显示如下:
还有一点值得一提的是分页列表需要放在class类为pagination的标签内,您可以使用text-align属性控制分页居中显示还是居右显示。
回调函数一般用来装载对应分页显示的内容,具体参见demo源文件。
四、参数参数名 | 描述 | 参数值 |
---|---|---|
maxentries | 总条目数 | 必选参数,整数 |
items_per_page | 每页显示的条目数 | 可选参数,默认是10 |
num_display_entries | 连续分页主体部分显示的分页条目数 | 可选参数,默认是10 |
current_page | 当前选中的页面 | 可选参数,默认是0,表示第1页 |
num_edge_entries | 两侧显示的首尾分页的条目数 | 可选参数,默认是0 |
link_to | 分页的链接 | 字符串,可选参数,默认是"#" |
prev_text | “前一页”分页按钮上显示的文字 | 字符串参数,可选,默认是"Prev" |
next_text | “下一页”分页按钮上显示的文字 | 字符串参数,可选,默认是"Next" |
ellipse_text | 省略的页数用什么文字表示 | 可选字符串参数,默认是"…" |
prev_show_always | 是否显示“前一页”分页按钮 | 布尔型,可选参数,默认为true,即显示“前一页”按钮 |
next_show_always | 是否显示“下一页”分页按钮 | 布尔型,可选参数,默认为true,即显示“下一页”按钮 |
callback | 回调函数 | 默认无执行效果 |
所有demo頁面的js註解我都改為了中文標註,難點在於回調函數,demo中回呼函數有兩個參數,一個是page_index,另一個是jq,前一個表示您當前點擊的那個分頁的頁數索引值,後一個參數表示裝載容器。這裡的頁數索引值是關鍵,我們要根據這個索引值找到對應的(例如)HTML元素,然後再指定的容器中顯示出來,demo中提供了裝載單元素以及多元素的方法,相信不會有太大問題。
如果您發現文章中有表述不準確或是有相關問題需要交流可以透過評論或是去這裡進行提問交流。
(本篇完)