jQuery分页插件kkpager的使用
插件作者的github地址：https://github.com/pgkk/kkpager
### 准备工作,引入js、css
<script type="text/javascript" src="/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="/kkpager.min.js"></script>
<link rel="stylesheet" type="text/css" href="/kkpager.css" />
### HTML DOM容器
<div id="kkpager"></div>
#### 1、使用click模式
<script type="text/javascript">
var currentPage = '1';
var total = '10';
var totalPage = '100';
kkpager.generPageHtml({
//当前页
pno: currentPage,
//总页码
total: totalPage,
//总数据条数
totalRecords: total,
mode: 'click',//默认值是link，可选link或者click
//点击跳转分页的处理
//点击页码、页码输入框跳转、以及首页、下一页等按钮都会调用click
click: function (n) {
//手动选中按钮
this.selectPage(n);
// 查询数据
search(n);
},
lang: {
firstPageText: '首页',
firstPageTipText: '首页',
lastPageText: '尾页',
lastPageTipText: '尾页',
prePageText: '上一页',
prePageTipText: '上一页',
nextPageText: '下一页',
nextPageTipText: '下一页',
totalPageBeforeText: '共',
totalPageAfterText: '页',
currPageBeforeText: '当前第',
currPageAfterText: '页',
totalInfoSplitStr: '/',
totalRecordsBeforeText: '共',
totalRecordsAfterText: '条数据',
gopageBeforeText: ' 转到',
gopageButtonOkText: '确定',
gopageAfterText: '页',
buttonTipBeforeText: '第',
buttonTipAfterText: '页'
}
}, true);
//第二个参数设置 true, 表示重置kkpager
</script>
### 必选参数
> `pno` 当前页码
> `total` 总页码
> `totalRecords` 总数据条数
### 可选参数
> `pagerid` 分页展示控件容器ID `字符串` 默认值 'kkpager' // 慎用 修改默认值，js源码以及css样式对应的kkpager都需要替换
> `mode` 模式，click或link `字符串` 默认值 'link'
> `isShowTotalPage` 是否显示总页数 `布尔型` 默认值 true
> `isShowCurrPage` 是否显示当前页 `布尔型` 默认值 true
> `isShowTotalRecords` 是否显示总记录数 `布尔型` 默认值 false (当`isShowTotalPage`为`true`时，此设置无效)
> `isShowFirstPageBtn` 是否显示首页按钮 `布尔型` 默认值 true
> `isShowLastPageBtn` 是否显示尾页按钮 `布尔型` 默认值 true
> `isShowPrePageBtn` 是否显示上一页按钮 `布尔型` 默认值 true
> `isShowNextPageBtn` 是否显示下一页按钮 `布尔型` 默认值 true
> `isGoPage` 是否显示页码跳转输入框 `布尔型` 默认值 true
> `isWrapedPageBtns` 是否用span包裹住页码按钮 `布尔型` 默认值 true
> `isWrapedInfoTextAndGoPageBtn` 是否用span包裹住分页信息和跳转按钮 `布尔型` 默认值 true
> `hrefFormer` 链接前部 `字符串` 默认值 ''
> `hrefLatter` 链接尾部 `字符串` 默认值 ''
> `lang` 语言配置对象，属性配置列表：
> - `firstPageText` 首页按钮文本 `字符串` 默认值 '首页'
> - `firstPageTipText` 首页按钮提示文本 `字符串` 默认值 '首页'
> - `lastPageText` 尾页按钮文本 `字符串` 默认值 '尾页'
> - `lastPageTipText` 尾页按钮提示文本 `字符串` 默认值 '尾页'
> - `prePageText` 上一页按钮文本 `字符串` 默认值 '上一页'
> - `prePageTipText` 上一页按钮提示文本 `字符串` 默认值 '上一页'
> - `nextPageText` 下一页按钮文本 `字符串` 默认值 '下一页'
> - `nextPageTipText` 下一页提示按钮文本 `字符串` 默认值 '下一页'
> - `totalPageBeforeText` 总页数前缀文本 `字符串` 默认值 '共'
> - `totalPageAfterText` 总页数后缀文本 `字符串` 默认值 '页'
> - `currPageBeforeText` 当前页前缀文本 `字符串` 默认值 '当前第'
> - `currPageAfterText` 当前页后缀文本 `字符串` 默认值 '页'
> - `totalInfoSplitStr` 分页统计信息部分的分隔符 `字符串` 默认值 '/'
> - `totalRecordsBeforeText` 总记录数前缀文本 `字符串` 默认值 '共'
> - `totalRecordsAfterText` 总记录数后缀文本 `字符串` 默认值 '条数据'
> - `gopageBeforeText` 跳转前缀文本 `字符串` 默认值 '转到'
> - `gopageAfterText` 跳转前缀文本 `字符串` 默认值 '页'
> - `gopageButtonOkText` 跳转按钮文本 `字符串` 默认值 '确定'
> - `buttonTipBeforeText` 页码按钮提示信息前缀 `字符串` 默认值 '第'
> - `buttonTipAfterText` 页码按钮提示信息后缀 `字符串` 默认值 '页'
> `gopageWrapId` 页码跳转dom ID `字符串` 默认值 'kkpager_gopage_wrap'
> `gopageButtonId` 页码跳转按钮dom ID `字符串` 默认值 'kkpager_btn_go'
> `gopageTextboxId` 页码输入框dom ID `字符串` 默认值 'kkpager_btn_go_input'
> `getLink` 链接算法函数（仅适用于mode为link） `函数类型`
> `click` 自定义事件处理函数（仅适用于mode为click） `函数类型`
> `getHref` 链接算法函数（仅适用于mode为click） `函数类型`
### 公开方法
> `selectPage` 手动调用此函数选中某个页码
//选中第n页码
kkpager.selectPage(n);
