转载主题：写了个Jquery异步分页插件

梦回forever

2012-09-03

关注关注

主题：写了个Jquery异步分页插件

publicclassPage{

/**

*当前页号

privateintcurrPageNum=1;

/**

*总记录数

privateinttotalRowSize=0;

/**

*每页记录数

privateintpageRowSize=10;

publicintgetCurrPageNum(){

returncurrPageNum;

}

publicvoidsetCurrPageNum(intcurrPageNum){

this.currPageNum=currPageNum;

}

publicintgetTotalPageNum(){

inttotal=(totalRowSize%pageRowSize==0)?(totalRowSize/pageRowSize):(totalRowSize/pageRowSize+1);

returntotal;

}

publicintgetTotalRowSize(){

returntotalRowSize;

}

publicvoidsetTotalRowSize(inttotalRowSize){

this.totalRowSize=totalRowSize;

}

publicintgetPageRowSize(){

returnpageRowSize;

}

publicvoidsetPageRowSize(intpageRowSize){

this.pageRowSize=pageRowSize;

}

publicintgetFirstResult(){

if(getCurrPageNum()<=0)return0;

returngetPageRowSize()*(getCurrPageNum()-1);

}

publicintgetMaxResult(){

returnthis.getFirstResult()+this.getPageRowSize();

}

==================================================================

然后看list_user.jsp：

Java代码

1.<%@pagelanguage="java"contentType="text/html;charset=UTF-8"pageEncoding="UTF-8"%>

2.<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

3.<htmlxmlns="http://www.w3.org/1999/xhtml">

4.<head>

5.<title>异步分页</title>

6.<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>

7.<linkhref="../css/local.css"rel="stylesheet"type="text/css"/>

8.<scripttype="text/javascript"src="../js/jquery-1.4.2.min.js"></script>

9.<scripttype="text/javascript"src="../js/asyn_page.js"></script>

10.<scripttype="text/javascript">

11.vartotalRowSize=${totalRowSize};

12.$(document).ready(function(){

13.$("#pageWidget").asynPage("/user/findUser_asyn.action","#tbody",buildHtml,totalRowSize);

14.});

15.

16.//构建内容

17.functionbuildHtml(users){

18.$.each(users,function(i,user){

19.vartr=[

20.'<tr>',

21.'<td>',user.userId,'</td>',

22.'<td>',user.username,'</td>',

23.'<td>',user.sex,'</td>',

24.'<td>',user.age,'</td>',

25.'<td>',user.email,'</td>',

26.'<td>',user.address,'</td>',

27.'<td>',user.registerTime,'</td>',

28.'<td></td>',

29.'</tr>'

30.].join('');

31.$("#tbody").append(tr);

32.});

33.}

34.</script>

35.</head>

36.<body>

37.<table>

38.<thead>

39.<tr>

40.<th>ID</th>

41.<th>用户名</th>

42.<th>性别</th>

43.<th>年龄</th>

44.<th>Email</th>

45.<th>地址</th>

46.<th>注册时间</th>

47.<th>操作</th>

48.</tr>

49.</thead>

50.<tbodyid="tbody"></tbody>

51.</table>

52.<divid="pageWidget"class="page"></div>

53.</body>

54.</html>

<%@pagelanguage="java"contentType="text/html;charset=UTF-8"pageEncoding="UTF-8"%>

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<head>

<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>

<linkhref="../css/local.css"rel="stylesheet"type="text/css"/>

<scripttype="text/javascript"src="../js/jquery-1.4.2.min.js"></script>

<scripttype="text/javascript"src="../js/asyn_page.js"></script>

<scripttype="text/javascript">

vartotalRowSize=${totalRowSize};

$(document).ready(function(){

$("#pageWidget").asynPage("/user/findUser_asyn.action","#tbody",buildHtml,totalRowSize);

});

//构建内容

functionbuildHtml(users){

$.each(users,function(i,user){

vartr=[

'<tr>',

'<td>',user.userId,'</td>',

'<td>',user.username,'</td>',

'<td>',user.sex,'</td>',

'<td>',user.age,'</td>',

'<td>',user.email,'</td>',

'<td>',user.address,'</td>',

'<td>',user.registerTime,'</td>',

'<td></td>',

'</tr>'

].join('');

$("#tbody").append(tr);

});

}

</script>

</head>

<body>

<table>

<thead>

<tr>

<th>Email</th>

</tr>

</thead>

<tbodyid="tbody"></tbody>

</table>

<divid="pageWidget"class="page"></div>

</body>

</html>

可以看到id为tbody的元素是作为分页内容展示容器，id为pageWidget的元素作为分页控件展示容器。

然后提供了一个buildHtml()函数来具体构建分页内容的。

使用异步分页插件很简单，只要这么调用：

Js代码

1.$("#pageWidget").asynPage("/user/findUser_asyn.action","#tbody",buildHtml,totalRowSize);

$("#pageWidget").asynPage("/user/findUser_asyn.action","#tbody",buildHtml,totalRowSize);这是最简化调用。还可以传额外查询参数，以及定制每页显示记录数，具体使用方式见插件的具体介绍。

下面是asynPage插件内容：

Js代码

1./*

2.*===================AJAX异步分页=================

3.*

5.*

6.*假设id为pageWidget的div是你放置分页控件的容器，则按如下形式调用：

7.*$("#pageWidget").asynPage("/user/findUser_asyn.action","#tbody",buildHtml,totalRowSize,{"pageRowSize":10});

8.*参数说明：

9.*------------Required-----------

10.*参数一：请求URL

11.*参数二：渲染结果集的页面容器

12.*参数三：负责渲染结果集到页面的函数

13.*参数四：总记录数

14.*------------Optional-----------

15.*参数五(json对象)：

16.*属性pageRowSize:每页记录数(不配置，则默认为20)

17.*属性param:请求参数(json格式)

18.*/

19.(function($){

20.varsettings;

21.varpage;

22.varparamStr;

23.

24.$.fn.asynPage=function(url,contentContainer,buildHtml_fun,totalRowSize,callerSettings){

25.

26.settings=$.extend({

27.currPageNum:1,

28.pageRowSize:20,

29.param:null

30.},callerSettings||{});

31.

32.settings.contentContainer=$(contentContainer);

33.settings.url=url;

34.settings.pageWidget=this;

35.settings.totalRowSize=totalRowSize;

36.settings.buildHtml_fun=buildHtml_fun;

37.

38.page=newPage(settings.currPageNum,settings.totalRowSize,settings.pageRowSize);

39.

40.paramStr=makeParamStr(settings.param);

41.

42.//开始获取数据

43.fetchData(page.getCurrPageNum());

44.

45.returnthis;

46.};

47.

48./*将json转换为请求参数字符串*/

49.vartrunParamConfig2RequestParamStr=function(json){

50.varstr="";

51.for(keyinjson){

52.if(str==""){

53.str+=key+"="+json[key];

54.}else{

55.str+="&"+key+"="+json[key];

56.}

57.}

58.returnstr;

59.};

60.

61./*将配置参数拼接为请求字符串*/

62.varmakeParamStr=function(param_json){

63.if(param_json==null){

64.return"";

65.}else{

66.returntrunParamConfig2RequestParamStr(param_json);

67.}

68.};

69.

70./*

71.*负责获取后台数据，获取完毕后会触发构建分页控件

72.*/

73.varfetchData=function(currPageNum){

74.

75.page.setCurrPageNum(currPageNum);

76.varfirstResult=page.getFirstResult();

77.varmaxResult=page.getMaxResult();

78.varpageRowSize=page.getPageRowSize();

79.

80.vardata=null;

81.if(paramStr){

82.data=paramStr+"&page.currPageNum="+currPageNum+"&page.pageRowSize="+pageRowSize+"&page.firstResult="+firstResult+"&page.maxResult="+maxResult;

83.}else{

84.data="page.currPageNum="+currPageNum+"&page.pageRowSize="+pageRowSize+"&page.firstResult="+firstResult+"&page.maxResult="+maxResult;

85.}

86.

87.$.ajax({

88.type:"POST",

89.url:settings.url,

90.data:data,

91.success:function(datas){

92.settings.contentContainer.empty();

93.settings.buildHtml_fun(datas);

94.buildPageWidget(page);//触发构建分页控件

95.},

96.error:function(xmlHttpRequest,textStatus,errorThrown){

97.if(textStatus=="error"){

98.varerror=eval('('+xmlHttpRequest.responseText+')');

99.alert("Sorry："+error.errorCode+"，"+error.message+"！");

100.}

101.}

102.});

103.};

104.

105.vartrunTargetPage=function(pageNum){

106.fetchData(pageNum);

107.}

108.

109./*为分页控件绑定事件*/

110.varbindEvent=function(){

111.varlinks=settings.pageWidget.find("a");

112.$.each(links,function(i,link){

113.varlink=$(link);

114.varpageNum=link.attr("pageNum");

115.link.click(function(){

116.trunTargetPage(pageNum);

117.});

118.});

119.}

120.

121./*构建分页控件的具体算法实现*/

122.varbuildPageWidget=function(page){

123.

124.//构建分页控件前，先清理现有控件

125.settings.pageWidget.empty();

126.

127./*---------------下面开始进入真正的分页控件构建过程--------------*/

128.

129./*---------------1.开始：构建描述信息（如“共？页，？条记录”）-----------------*/

130.settings.pageWidget.append("<divclass='total'>共<span>"+page.getTotalPageNum()+"</span>页 <span>"+page.getTotalRowSize()+"</span>条记录</div>");

131.settings.pageWidget.append("<ul>");

132./*---------------1.结束：构建描述信息（如“共？页，？条记录”）-----------------*/

133.

134./*---------------2.开始：构建“首页”和“上一页”控件-------------*/

135.varcurrPageNum=Number(page.getCurrPageNum());

136.vartotalPageNum=Number(page.getTotalPageNum());

137.

138.if(currPageNum==1){

139.//如果你希望当前页是第一页的时候，也允许“首页”和“上一页”控件出现，则可以在这里进行补充

140.}else{

141.settings.pageWidget.find("ul").append("<li><aid=''pageNum='1'href='javascript:void(0);'title='首页'class='first'>首页</a></li>");

142.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+(currPageNum-1)+"'href='javascript:void(0);'title='上一页'class='prev'>上一页</a></li>");

143.}

144./*---------------2.结束：构建“首页”和“上一页”控件-------------*/

145.

146./*---------------3.开始：构建分页数字控件--------------*/

147.if(totalPageNum<10){

148.for(vari=1;i<=totalPageNum;i++){

149.if(i==currPageNum){

150.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='current'>"+i+"</a></li>");

151.}else{

152.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='javascript:trunTargetPage("+i+");'>"+i+"</a></li>");

153.}

154.}

155.//如果总页数>=10

156.}else{

157.//如果当前页小于5，则显示1-9项，且记忆当前项

158.if(currPageNum<5){

159.for(vari=1;i<10;i++){

160.if(i==currPageNum){

161.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='current'>"+i+"</a></li>");

162.}else{

163.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class=''>"+i+"</a></li>");

164.}

165.}

166.//如果当前页>=5，且总页数与当前页的差<4

167.}elseif(totalPageNum-currPageNum<4){

168.for(vari=totalPageNum-8;i<=totalPageNum;i++){

169.if(i==currPageNum){

170.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='current'>"+i+"</a></li>");

171.}else{

172.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class=''>"+i+"</a></li>");

173.}

174.}

175.//如果当前页>=5，则显示围绕当前页的9项，且记忆当前项

176.}else{

177.for(vari=currPageNum-4;i<currPageNum+5;i++){

178.if(i==currPageNum){

179.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='current'>"+i+"</a></li>");

180.}else{

181.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void("+i+");'title=''class=''>"+i+"</a></li>");

182.}

183.}

184.}

185.}

186./*---------------3.结束：构建分页数字控件--------------*/

187.

188./*---------------4.开始：构建“下一页”和“尾页”控件-------------*/

189.if(totalPageNum==currPageNum){

190.//如果你希望当前页是最后一页的时候，也允许“尾页”和“下一页”控件出现，则可以在这里进行补充

191.}else{

192.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+(currPageNum+1)+"'href='javascript:void(0);'title='下一页'class='next'>下一页</a></li>");

193.settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+totalPageNum+"'href='javascript:void(0);'title='尾页'class='last'>尾页</a></li>");

194.}

195./*---------------4.结束：构建“下一页”和“尾页”控件-------------*/

196.

197.//还要为控件绑定点击事件

198.bindEvent();

199.}

200.

201.})(jQuery);

202.

203./*

204.*Page类

205.*/

206.functionPage(currPageNum,totalRowSize,pageRowSize){

207.this.currPageNum=currPageNum;

208.this.totalRowSize=totalRowSize;

209.this.pageRowSize=pageRowSize;

210.}

211.Page.prototype.getCurrPageNum=function(){

212.returnthis.currPageNum;

213.};

214.Page.prototype.setCurrPageNum=function(currPageNum){

215.this.currPageNum=currPageNum;

216.};

217.Page.prototype.getTotalPageNum=function(){

218.return(this.totalRowSize%this.pageRowSize==0)?(this.totalRowSize/this.pageRowSize):(Math.floor(this.totalRowSize/this.pageRowSize)+1);

219.};

220.Page.prototype.getTotalRowSize=function(){

221.returnthis.totalRowSize;

222.};

223.Page.prototype.setTotalRowSize=function(totalRowSize){

224.this.totalRowSize=totalRowSize;

225.};

226.Page.prototype.getPageRowSize=function(){

227.returnthis.pageRowSize;

228.};

229.Page.prototype.setPageRowSize=function(pageRowSize){

230.this.pageRowSize=pageRowSize;

231.};

232.Page.prototype.getFirstResult=function(){

233.if(this.getCurrPageNum()<=0)return0;

234.returnthis.getPageRowSize()*(this.getCurrPageNum()-1);

235.};

236.Page.prototype.getMaxResult=function(){

237.returnthis.getFirstResult()+this.getPageRowSize();

238.};

*===================AJAX异步分页=================

*假设id为pageWidget的div是你放置分页控件的容器，则按如下形式调用：

*$("#pageWidget").asynPage("/user/findUser_asyn.action","#tbody",buildHtml,totalRowSize,{"pageRowSize":10});

*参数说明：

*------------Required-----------

*参数一：请求URL

*参数二：渲染结果集的页面容器

*参数三：负责渲染结果集到页面的函数

*参数四：总记录数

*------------Optional-----------

*参数五(json对象)：

*属性pageRowSize:每页记录数(不配置，则默认为20)

*属性param:请求参数(json格式)

(function($){

varsettings;

varpage;

varparamStr;

$.fn.asynPage=function(url,contentContainer,buildHtml_fun,totalRowSize,callerSettings){

settings=$.extend({

currPageNum:1,

pageRowSize:20,

param:null

},callerSettings||{});

settings.contentContainer=$(contentContainer);

settings.url=url;

settings.pageWidget=this;

settings.totalRowSize=totalRowSize;

settings.buildHtml_fun=buildHtml_fun;

page=newPage(settings.currPageNum,settings.totalRowSize,settings.pageRowSize);

paramStr=makeParamStr(settings.param);

//开始获取数据

fetchData(page.getCurrPageNum());

returnthis;

};

/*将json转换为请求参数字符串*/

vartrunParamConfig2RequestParamStr=function(json){

varstr="";

for(keyinjson){

if(str==""){

str+=key+"="+json[key];

}else{

str+="&"+key+"="+json[key];

}

returnstr;

};

/*将配置参数拼接为请求字符串*/

varmakeParamStr=function(param_json){

if(param_json==null){

return"";

}else{

returntrunParamConfig2RequestParamStr(param_json);

}

};

*负责获取后台数据，获取完毕后会触发构建分页控件

varfetchData=function(currPageNum){

page.setCurrPageNum(currPageNum);

varfirstResult=page.getFirstResult();

varmaxResult=page.getMaxResult();

varpageRowSize=page.getPageRowSize();

vardata=null;

if(paramStr){

data=paramStr+"&page.currPageNum="+currPageNum+"&page.pageRowSize="+pageRowSize+"&page.firstResult="+firstResult+"&page.maxResult="+maxResult;

}else{

data="page.currPageNum="+currPageNum+"&page.pageRowSize="+pageRowSize+"&page.firstResult="+firstResult+"&page.maxResult="+maxResult;

}

$.ajax({

type:"POST",

url:settings.url,

data:data,

success:function(datas){

settings.contentContainer.empty();

settings.buildHtml_fun(datas);

buildPageWidget(page);//触发构建分页控件

error:function(xmlHttpRequest,textStatus,errorThrown){

if(textStatus=="error"){

varerror=eval('('+xmlHttpRequest.responseText+')');

alert("Sorry："+error.errorCode+"，"+error.message+"！");

}

});

};

vartrunTargetPage=function(pageNum){

fetchData(pageNum);

}

/*为分页控件绑定事件*/

varbindEvent=function(){

varlinks=settings.pageWidget.find("a");

$.each(links,function(i,link){

varlink=$(link);

varpageNum=link.attr("pageNum");

link.click(function(){

trunTargetPage(pageNum);

});

}

/*构建分页控件的具体算法实现*/

varbuildPageWidget=function(page){

//构建分页控件前，先清理现有控件

settings.pageWidget.empty();

/*---------------下面开始进入真正的分页控件构建过程--------------*/

/*---------------1.开始：构建描述信息（如“共？页，？条记录”）-----------------*/

settings.pageWidget.append("<divclass='total'>共<span>"+page.getTotalPageNum()+"</span>页 <span>"+page.getTotalRowSize()+"</span>条记录</div>");

settings.pageWidget.append("<ul>");

/*---------------1.结束：构建描述信息（如“共？页，？条记录”）-----------------*/

/*---------------2.开始：构建“首页”和“上一页”控件-------------*/

varcurrPageNum=Number(page.getCurrPageNum());

vartotalPageNum=Number(page.getTotalPageNum());

if(currPageNum==1){

//如果你希望当前页是第一页的时候，也允许“首页”和“上一页”控件出现，则可以在这里进行补充

}else{

settings.pageWidget.find("ul").append("<li><aid=''pageNum='1'href='javascript:void(0);'title='首页'class='first'>首页</a></li>");

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+(currPageNum-1)+"'href='javascript:void(0);'title='上一页'class='prev'>上一页</a></li>");

}

/*---------------2.结束：构建“首页”和“上一页”控件-------------*/

/*---------------3.开始：构建分页数字控件--------------*/

if(totalPageNum<10){

for(vari=1;i<=totalPageNum;i++){

if(i==currPageNum){

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='current'>"+i+"</a></li>");

}else{

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='javascript:trunTargetPage("+i+");'>"+i+"</a></li>");

}

//如果总页数>=10

}else{

//如果当前页小于5，则显示1-9项，且记忆当前项

if(currPageNum<5){

for(vari=1;i<10;i++){

if(i==currPageNum){

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='current'>"+i+"</a></li>");

}else{

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class=''>"+i+"</a></li>");

}

//如果当前页>=5，且总页数与当前页的差<4

}elseif(totalPageNum-currPageNum<4){

for(vari=totalPageNum-8;i<=totalPageNum;i++){

if(i==currPageNum){

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='current'>"+i+"</a></li>");

}else{

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class=''>"+i+"</a></li>");

}

//如果当前页>=5，则显示围绕当前页的9项，且记忆当前项

}else{

for(vari=currPageNum-4;i<currPageNum+5;i++){

if(i==currPageNum){

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void(0);'title=''class='current'>"+i+"</a></li>");

}else{

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+i+"'href='javascript:void("+i+");'title=''class=''>"+i+"</a></li>");

}

/*---------------3.结束：构建分页数字控件--------------*/

/*---------------4.开始：构建“下一页”和“尾页”控件-------------*/

if(totalPageNum==currPageNum){

//如果你希望当前页是最后一页的时候，也允许“尾页”和“下一页”控件出现，则可以在这里进行补充

}else{

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+(currPageNum+1)+"'href='javascript:void(0);'title='下一页'class='next'>下一页</a></li>");

settings.pageWidget.find("ul").append("<li><aid=''pageNum='"+totalPageNum+"'href='javascript:void(0);'title='尾页'class='last'>尾页</a></li>");

}

/*---------------4.结束：构建“下一页”和“尾页”控件-------------*/

//还要为控件绑定点击事件

bindEvent();

}

})(jQuery);

*Page类

functionPage(currPageNum,totalRowSize,pageRowSize){

this.currPageNum=currPageNum;

this.totalRowSize=totalRowSize;

this.pageRowSize=pageRowSize;

}

Page.prototype.getCurrPageNum=function(){

returnthis.currPageNum;

};

Page.prototype.setCurrPageNum=function(currPageNum){

this.currPageNum=currPageNum;

};

Page.prototype.getTotalPageNum=function(){

return(this.totalRowSize%this.pageRowSize==0)?(this.totalRowSize/this.pageRowSize):(Math.floor(this.totalRowSize/this.pageRowSize)+1);

};

Page.prototype.getTotalRowSize=function(){

returnthis.totalRowSize;

};

Page.prototype.setTotalRowSize=function(totalRowSize){

this.totalRowSize=totalRowSize;

};

Page.prototype.getPageRowSize=function(){

returnthis.pageRowSize;

};

Page.prototype.setPageRowSize=function(pageRowSize){

this.pageRowSize=pageRowSize;

};

Page.prototype.getFirstResult=function(){

if(this.getCurrPageNum()<=0)return0;

returnthis.getPageRowSize()*(this.getCurrPageNum()-1);

};

Page.prototype.getMaxResult=function(){

returnthis.getFirstResult()+this.getPageRowSize();

};

jquery分页 jquery

安科网

转载主题：写了个Jquery异步分页插件

梦回forever

梦回forever

相关推荐

分享一些经典的特效效果,希望对大家有帮助

这些效果我很喜欢，但愿对你们也有帮助

很有点意思的特效，本人很喜欢

很有点意思的特效，本人很喜欢

对前端特效感兴趣的同学可以留意下这些例子，有点意思

jquery 分页

jquery 分页插件 Smart Paginator

jquery datatable 的分页参数太坑爹了

jquery实现动态创建form并提交的方法示例

jQuery pagination分页示例详解

jquery分页插件pagination使用教程

jQuery Pagination分页插件

jQuery插件--分页

jquery datatable 的分页参数太坑爹了

基于jQuery封装的分页组件（可自定义设置）

Jquery Datatables 异步分页加载数据

推荐60个jQuery插件

jQuery .tmpl() 用法

资源: 优秀插件收集-布局,表格,分页,树形

一个强大的jquery分页插件(转载)

梦回forever

转载 主题：写了个Jquery异步分页插件

相关推荐

转载主题：写了个Jquery异步分页插件