simplePagination API

simplePagination API

simplePagination.js

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

分页button样式

"light-theme"

simplePagination API

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc29pbG92ZTc=/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="">

"dark-theme"

simplePagination API

"compact-theme"

simplePagination API

下载地址

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

使用

Step 1: 加入js和css

<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>

<!-- JS -->

<script type="text/javascript" src="plug/simplePagination/tests/lib/jquery.min.js"></script>

<script type="text/javascript" src="plug/simplePagination/jquery.simplePagination.js"></script>

<!-- CSS -->

<link type="text/css" rel="stylesheet" href="plug/simplePagination/simplePagination.css"/>

: 加入js代码

$(function(){

$("#paging2").pagination({

items: 100,

itemsOnPage: 10,

cssStyle: 'dark-theme'

});

});

: 加入样式

<style type="text/css">

a{text-decoration:none}

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

</style>

: 加入div

<!--分页div-->

<div id="paging2" class="page"></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"

上一页button显示文本

nextText

String

Default: "Next"

下一页button显示文本

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"

分页button样式

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);

});

上一篇:引擎设计跟踪(九.14.2b) 骨骼动画基本完成


下一篇:【原创】.NET平台机器学习组件-Infer.NET连载(二)贝叶斯分类器