码迷,mamicode.com
首页 > Web开发 > 详细

[js开源组件开发]ajax分页组件

时间:2015-06-12 17:04:23      阅读:135      评论:0      收藏:0      [点我收藏+]

标签:

ajax分页组件

我以平均每一周出一个开源的js组件为目标行动着,虽然每个组件并不是很庞大,它只完成某一个较小部分的工作,但相信,只要有付出,总会得到回报的。这个组件主要完成分页的工作。

技术分享

这张图里显示的是这个分页控件的两种基本形态,样式可以自己定制,包括文案内容。

这个分页控件的demo演示地址是: http://www.lovewebgames.com/jsmodule/paging.html

同时,它还是开源的,它的git 地址是:https://github.com/tianxiangbing/paging

 

paging

分页控件paging 例子见DEMO

使用方法案例:

<div id="pageTool"></div>
$(‘#pageTool‘).Paging({pagesize:10,count:100});

或者

var p = new Paging();
p.init({target:‘#pageTool‘,pagesize:10,count:100});

  


属性和方法

pagesize:

每页的条数

current:

当前页码,默认为1

prevTpl

上一页的模板,默认“上一页”

nextTpl

下一页的模板,默认“下一页”

firstTpl

首页的模板,默认“首页”

lastTpl

末页的模板,默认“末页”

ellipseTpl

省略号的模板,默认“...”

toolbar: bool

是否显示工具栏,默认为false

pageSizeList:[]

当显示工具栏时有效,可设置每页条数,默认为[5,10,15,20]

changePagesize:function(ps)

修改每页的条数,参数为int

go:function(p)

跳转至某一页,默认到current

render:function(ops)

重新渲染,ops:{count:int,pagesize:int,current:int,pagecount:int}

  

[js开源组件开发]ajax分页组件

标签:

原文地址:http://www.cnblogs.com/tianxiangbing/p/paging.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!