标签：pagination   分页   js   api   

simplePagination API

 

simplePagination.js

一个简单的jQuery分页插件，主题和Bootstrap支持CSS 3

分页按钮样式

"light-theme" 

 

"dark-theme"

 

"compact-theme"

 

下载地址

http://www.arungudelli.com/jquery/simple-pagination-using-jquery/

 

使用

Step 1: 添加js和css

 

 

Step 2: 添加js代码

$(function(){

  $("#paging2").pagination({

          items: 100,

         itemsOnPage: 10,

         cssStyle: ‘dark-theme‘

     });

});

 

Step 3: 添加样式

a{text-decoration:none}

.page{margin:30px auto;width:620px}

Step 4: 添加div

 

属性选项

属性	类型	默认值	备注
items	Integer	Default: 1	总条数
itemsOnPage	Integer	Default: 1	每页显示条数
pages	Integer	Optional	强制设置分页的固定页数，这将使items和itemsOnPage属性失效。
displayedPages	Integer	Default: 5	开始隐藏页码的页数，默认5，最小为3
edges	Integer	Default: 2	How many page numbers are visible at the beginning/ending of the pagination.
currentPage	Integer	Default: 1	当前页
hrefTextPrefix	String	Default: "#page-"	悬停在页码时显示地址的页码前缀。http://xxxxx/test.html#前缀-1
hrefTextSuffix	String	Default: empty string	悬停在页码时显示地址的页码后缀。http://xxxxx/test.html#page-1-后缀
prevText	String	Default: "Prev"	上一页按钮显示文本
nextText	String	Default: "Next"	下一页按钮显示文本
labelMap	Array	Default: empty array	A collection of labels that will be used to render the pagination items, replacing the numbers.
cssStyle	String	Default: "light-theme"	分页按钮样式
selectOnClick	Boolean	Default: true	Set to false if you don‘t want to select the page immediately after click.
onPageClick(pageNumber, event)	Function	Optional	页码点击事件调用函数，可选参数
onInit	Function	Optional	Function to call when the pagination is initialized.

方法

selectPage - 指定一个分页的页码

$(function() { 

   $("#paging2").pagination(‘selectPage‘, 3);

});

prevPage - Selects the previous page.

$(function() { 

   $("#paging2").pagination(‘prevPage‘);

});

nextPage - Select the next page.

$(function() { 

   $("#paging2").pagination(‘nextPage‘);

});

getPagesCount - 返回总页数

$(function() { 

   $("#paging2").pagination(‘getPagesCount‘);

});

 

getCurrentPage - 返回当前的页面.

$(function() { 

   $(selector).pagination(‘getCurrentPage‘);

});

disable - 禁用分页功能.

$(function() { 

   $("#paging2").pagination(‘disable‘);

});

enable - 解禁分页功能.

$(function() { 

   $("#paging2").pagination(‘enable‘);

});

destroy - 将分页破坏掉

$(function() { 

$("#paging2").pagination(‘destroy‘);

});

redraw - 将分页破坏状态恢复

$(function() { 

$("#paging2").pagination(‘redraw‘);

});

updateItems - 允许动态的修改总条数

$(function() { 

   $("#paging2").pagination(‘updateItems‘, 100);

});
updateItemsOnPage - 动态的修改总条数后恢复指定总条数

$(function() { 

$("#paging2").pagination(‘updateItemsOnPage‘,100);

});

drawPage - 将当页的数据指定到指定页码

$(function() { 

$("#paging2").pagination(‘drawPage‘, 2);

});

simplePagination API

标签：pagination   分页   js   api   

原文地址：http://blog.csdn.net/soilove7/article/details/40752869