网上有很多js分页插件,一开始我也是在网上找了几款js分页插件,不过有的对ie6兼容不太好,就自己写了一个,其实也不难。这个是js根据服务器返回的总条目数进行分页的,分割大小自定义。
修改为jqery插件形式方便。css外部定义
使用:$(".xxxx").pages()
$("#pages").pages(
{
"nums":10,
"start":1,
"display":5,
"def":5,
"name":'name',
"column":"paper",
callback:function(page){
//method方法体
}
}
);
方法体:
jQuery.fn.extend({
pages:function(param){
//参数对象
//example param={"nums":6,"start":1,"display":5,"def":5,"name":"note","column":"paper",callback:function(page){}};
//default 分段数
var pages=$(this);
pages.html("");
//求分割页数 以def为每页数量
count=param.nums%param.def!=0?parseInt(param.nums/param.def)+1:param.nums/param.def;
pages.append("<a>总数"+param.nums+"/页数"+count+"</a>");
pages.append("<a class='changepage' id='1' name='"+param.name+"' column='"+param.column+"'>首页</a>");
if (param.start > 1){
pages.append("<a class='changepage' name='"+param.name+"' column='"+param.column+"' id="+(parseInt(param.start)-1)+">上一页</a>");
}
//i->index 索引
var i=param.start-parseInt(param.display/2) > 0 ? param.start-parseInt(param.display/2):1;
for (;i<=count && i <= param.start+parseInt(param.display/2);i++){
if (i!=param.start){
pages.append("<a class='changepage' name='"+param.name+"' column='"+param.column+"' id="+i+">"+i+"</a>");
}else{
pages.append("<a>"+i+"</a>");
}
}
if (count > param.start){
pages.append("<a class='changepage' name='"+param.name+"' column='"+param.column+"' id="+(parseInt(param.start)+1)+">下一页</a>");
}
pages.append("<a class='changepage' name='"+param.name+"' column='"+param.column+"' id="+count+">末页</a>");
$(".changepage",pages).css("color","white");
$(".changepage",pages).live('click',function(){
//call this page object
param.callback($(this));
});
}
});