对之前写的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");
}