网上有很多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)); }); } });