JavaScript实现列表分页功能特效

最近写了一个js分页的方法，尽管已经有现成的可以用，但还是想自己写写，搞搞清楚。最终实现的效果是：上一页、第一页、…（上n个页码）、n个页码、…（下n个页码）、最后一页、下一页。n可以是奇数也可以是偶数，一般都喜欢取奇数，星石调用的时候传入的参数是5。写的时候，主要注意了以下几个地方：
页码等于1时，只显示上一页、第一页、最后一页，且都没有跳转；
页码小于等于2时，不需要中间的n个页码；
页码小于等于n时，显示所有页码，不显示2个“…”；
2个“…”换页时，换n个页码，如果接近最前面或最后面几页了，则显示最前面或最后面n个页码。
下面贴出代码，供大家探讨：

//总页数，当前页数，跳转地址，第一页和最后一页之间显示的页码数量function pageBar（tp,cp,url,pn）{var str = ‘<ul class=”page”>";if（tp>1 && cp>1）{var prev = cp-1;str += ‘<li><a class=”prev” title=”上一页” href=”javascript:goPage（‘+prev+‘,”+url+‘"）;”><span>上一页</span></a></li> ‘;}else{str += ‘<li><a class=”prev” title=”上一页” href=”javascript:void（0）;”><span>上一页</span></a></li> ‘;}if（tp>1）{//第一页if（cp==1）{str +=‘<li class=”current”><a href=”javascript:goPage（1,”+url+‘"）;”><span>1</span></a></li> ‘;}else{str +=‘<li><a href=”javascript:goPage（1,”+url+‘"）;”><span>1</span></a></li> ‘;}if（tp>2）{var pnh = Math.floor（pn/2）;//循环开始页码var s = cp-pnh;if（s<=1）{s = 2;}//循环结束页码var e = cp+pnh;if（e>=tp）{e = tp-1;}if（s<=（1+pnh））{if（tp>（pn+2））{e = s+（pn-1）;if（e>=tp）{e = tp-1;}}else{s = 2;}}if（e>=（tp-pnh））{if（tp>（pn+2））{s = e-（pn-1）;if（s<=1）{s = 2;}}else{e = tp-1;}}if（e<s）{e = s;}//第一页后的多页跳转if（s>2）{var sp = cp-pn;if（sp<1）{sp=1;}str += ‘<li><a name=”break” href=”javascript:goPage（‘+sp+‘,”+url+‘"）;”><span>…</span></a></li> ‘;}for（var i=s;i<=e;i++）{if（i==cp）{str += ‘<li class=”current”><a href=”javascript:goPage（‘+i+‘,”+url+‘"）;”><span>"+i+‘</span></a></li> ‘;}else{str += ‘<li><a href=”javascript:goPage（‘+i+‘,”+url+‘"）;”><span>"+i+‘</span></a></li> ‘;}}//最后一页前的多页跳转if（e < （tp-1））{var ep = cp+pn;if（ep>tp）{ep=tp;}str += ‘<li><a name=”break” href=”javascript:goPage（‘+ep+‘,”+url+‘"）;”><span>…</span></a></li> ‘;}}//最后一页if（cp==tp）{str +=‘<li class=”current”><a href=”javascript:goPage（‘+tp+‘,”+url+‘"）;”><span>"+tp+‘</span></a></li> ‘;}else{str +=‘<li><a href=”javascript:goPage（‘+tp+‘,”+url+‘"）;”><span>"+tp+‘</span></a></li> ‘;}}else{str +=‘ <li class=”current”><a href=”javascript:void（0）;”><span>1</span></a></li> ‘;}if（tp>1 && cp<tp）{var next = cp+1;str += ‘<li><a class=”next” title=”下一页” href=”javascript:goPage（‘+next+‘,”+url+‘"）;”><span>下一页</span></a></li>";}else{str += ‘<li><a class=”next” title=”下一页” href=”javascript:void（0）;”><span>下一页</span></a></li>";}str += ‘</ul>";return str;}//跳转页码，跳转地址function goPage（cp,url）{window.location.href = url+cp;}

以上所述就是本文的全部内容了，希望大家能够喜欢。