对之前写的jquery分页做下升级
以前写的分页用了好久了,但是分页时除了传页面外有时还要传一些其它参数,以前操作时要把传的参数放到隐藏hidden中,分页时在取出来,这样比较麻烦,今天无事,重新包装了一下
直接上代码吧
css用了bootstrap中分页的样式
.pagination-lg>li:first-child>a, .pagination-lg>li:first-child>span{ border-bottom-left-radius:6px; border-top-left-radius:6px; } .pagination-lg>li:last-child>a, .pagination-lg>li:last-child>span{ border-top-right-radius:6px; border-bottom-right-radius:6px; } .pagination-sm>li>a, .pagination-sm>li>span{ padding:5px10px; font-size:12px; } .pagination-sm>li:first-child>a, .pagination-sm>li:first-child>span{ border-bottom-left-radius:3px; border-top-left-radius:3px; } .pagination-sm>li:last-child>a, .pagination-sm>li:last-child>span{ border-top-right-radius:3px; border-bottom-right-radius:3px; } .sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }
分页代码:
(function($){ varPageFunc=functionPageFunc(){} $.PageFunc=function(Total,PageSize,curPageNum,FunUrl,paramStr){ if(PageSize==""||PageSize==null||PageSize==undefined){ PageSize=10; } if(curPageNum==""||curPageNum==null||curPageNum==undefined){ curPageNum=1; } varhasParam=true; if(paramStr==""||paramStr==null||paramStr==undefined){ hasParam=false; } //计算总页数 Total=parseInt(Total);//总记录数 PageSize=parseInt(PageSize);//每页显示数 curPageNum=parseInt(curPageNum);//当前页 //总页数 varAllPage=Math.floor(Total/PageSize); if(Total%PageSize!=0){ AllPage++; } varnavHtml="<ulstyle='margin:0000;'class='pagination'>"; if(curPageNum<=0) curPageNum=1; if(AllPage>1){ if(curPageNum!=1){ //处理首页连接 varhome=1; if(hasParam) { home=home+","+paramStr; } navHtml+="<li><ahref='javascript:"+FunUrl+"("+home+")'>|<</a></li>"; } if(curPageNum>1){ varprevious=parseInt(parseInt(curPageNum)-1); if(hasParam) { previous=previous+","+paramStr; } //处理上一页的连接 navHtml+="<li><ahref='javascript:"+FunUrl+"("+previous+")'><<</a></li>"; } else{ navHtml+="<liclass='disabled'><a><<</a></li>"; } varcurrint=5; for(vari=0;i<=10;i++){ //一共最多显示10个页码,前面5个,后面5个 if((curPageNum+i-currint)>=1&&(curPageNum+i-currint)<=AllPage) if(currint==i){ //当前页处理 navHtml+="<liclass='active'><a>"+curPageNum+"<spanclass='sr-only'>(current)</span></a></li>"; } else{ //一般页处理 varn=parseInt(parseInt(curPageNum)+parseInt(i)-parseInt(currint)); varnstr=n; if(hasParam) { nstr=nstr+","+paramStr; } navHtml+="<li><ahref='javascript:"+FunUrl+"("+nstr+")'>"+n+"</a></li>"; } } if(curPageNum<AllPage){ //处理下一页的链接 varnext=parseInt(parseInt(curPageNum)+1); if(hasParam) { next=next+","+paramStr; } navHtml+="<li><ahref='javascript:"+FunUrl+"("+next+")'>>></a></li>"; } else{ navHtml+="<liclass='disabled'><a>>></a></li>"; } if(curPageNum!=AllPage){ varlast=parseInt(AllPage); if(hasParam) { last=last+","+paramStr; } navHtml+="<li><ahref='javascript:"+FunUrl+"("+last+")'>>|</a></li>"; } } if(parseInt(AllPage)!=0) { navHtml+="<li><a>"+curPageNum+"/"+AllPage+"</a></li> "; } navHtml+="</ul>"; returnnavHtml; }; })(jQuery);
调用方法:
注意:第一参数一定要是当前页的值啊
functionaa(curpage,param1,param2){ if(curpage==""||curpage==null||curpage==undefined){ curpage=1; } varpagesize=5; varparamStr=""; paramStr=param1+","+param2+"; $.post("/appdefult/apporder",{"categoryId":param1,"name":param2,"curpage":curpage,"pagesize":pagesize},function(mydata){ varpageHtml=$.PageFunc(mydata.total,pagesize,curpage,"aa",paramStr); $(".page").html(pageHtml); },"json"); }