whjPaging:

使用方法：

1.引入样式和脚本

[html]  view plain  copy

1. <div id="pagination" style="float: right;">  
2. <span style="white-space:pre;"> </span><input type="text" style="display:none; " id="readAllsum" value="${readAllsum}">  
3. </div>  

2.调用插件

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47

$( "#pagination" ).whjPaging({      //可选，每页显示条数下拉框，默认下拉框5条/页(默认)、10条/页、15条/页、20条/页      pageSizeOpt: [          { 'value' : 5,  'text' :  '5条/页' ,  'selected' :  true },          { 'value' : 10,  'text' :  '10条/页' },          { 'value' : 15,  'text' :  '15条/页' },          { 'value' : 20,  'text' :  '20条/页' }      ],      //可选，css设置，可设置值：css-1，css-2，css-3，css-4，css-5，默认css-1，可自定义样式      css:  'css-1' ,      //可选，总页数      totalPage: 100,      //可选，展示页码数量，默认5个页码数量      showPageNum: 5,      //可选，首页按钮展示文本，默认显示文本为首页      firstPage:  '首页' ,      //可选，上一页按钮展示文本，默认显示文本为上一页      previousPage:  '上一页' ,      //可选，下一页按钮展示文本，默认显示文本为下一页      nextPage:  '下一页' ,      //可选，尾页按钮展示文本，默认显示文本为尾页      lastPage:  '尾页' ,      //可选，跳至展示文本，默认显示文本为跳至      skip:  '跳至' ,      //可选，确认按钮展示文本，默认显示文本为确认      confirm:  '确认' ,      //可选，刷新按钮展示文本，默认显示文本为刷新      refresh:  '刷新' ,      //可选，共{}页展示文本，默认显示文本为共{}页，其中{}会在js具体转化为数字      totalPageText:  '共{}页' ,      //可选，是否展示首页与尾页，默认true      isShowFL:  true ,      //可选，是否展示每页N条下拉框，默认true      isShowPageSizeOpt:  true ,      //可选，是否展示跳到指定页数，默认true      isShowSkip:  true ,      //可选，是否展示刷新，默认true      isShowRefresh:  true ,      //可选，是否展示共{}页，默认true      isShowTotalPage:  true ,      //可选，是否需要重新设置当前页码及总页数，默认false，如果设为true，那么在请求服务器返回数据时，需要调用setPage方法      isResetPage:  false ,      //必选，回掉函数，返回参数：第一个参数为页码，第二个参数为每页显示N条      callBack:  function  (currPage, pageSize) {          console.log( 'currPage:'  + currPage +  '     pageSize:'  + pageSize);      } });

3.获取当前页码及总页数

1 2	// [当前页码, 总页数] $( "#pagination" ).whjPaging( "getPage" );

4.设置当前页码及总页数

1 2	//参数2: 当前页码, 参数3: 总页数 $( "#pagination" ).whjPaging( "setPage" , 1, 10);

5.可自定义样式

具体请详细看pagination.css

链接: 点击打开链接 密码: yfcb

原文链接：点击打开链接