一个好用的js分页

来源:互联网 发布:生意参谋和数据魔方 编辑:程序博客网 时间:2024/05/10 11:04

<ul id="yeji">
<li><a><img title="bg-yeji-tu.jpg" src="/public/ueditor/php/upload/20130827/13775963929389.jpg"/><span>业绩</span></a></li>

<li><a><img title="bg-yeji-tu.jpg" src="/public/ueditor/php/upload/20130827/13775963929389.jpg"/><span>业绩</span></a></li>

<li><a><img title="bg-yeji-tu.jpg" src="/public/ueditor/php/upload/20130827/13775963929389.jpg"/><span>业绩</span></a></li>

<li><a><img title="bg-yeji-tu.jpg" src="/public/ueditor/php/upload/20130827/13775963929389.jpg"/><span>业绩</span></a></li>                       
</ul>
<div class="yema"id="changpage">
                       
</div>



<script type="text/javascript">

var obj,j;

var page=0;
//当前页
var listNum=10;//每页显示<ul>数
var PagesLen;//总页数
var PageNum=0;//分页链接接数(5个)
onload=function(){
obj=document.getElementById("yeji").getElementsByTagName("li");
dx=obj;
dxname="obj";


// obj2=document.getElementById("show_news2").getElementsByTagName("li");
// dx2=obj2;
// dxname2="obj2";


// obj3=document.getElementById("show_news3").getElementsByTagName("li");
// dx3=obj3;
// dxname3="obj3";






upPage2(0,"changpage",dx,dxname)
// upPage2(0,"changpage2",dx2,dxname2)
// upPage2(0,"changpage3",dx3,dxname3)


}


function upPage2(p,rongqi,dx,dxname){
var nowPage=0;
j=dx.length
PagesLen=Math.ceil(j/listNum);


nowPage=p
//内容变换
for (var i=0;i<j;i++){
dx[i].style.display="none"
}
for (var i=p*listNum;i<(p+1)*listNum;i++){
if(dx[i])dx[i].style.display="block"
}
//分页链接变换
if(nowPage==0)
strS='<a>上一页</a>  '
else
strS='<a href="###" onclick="upPage2('+(nowPage-1)+',\''+rongqi+'\','+dxname+',\''+dxname+'\')">上一页</a>  '
var PageNum_2=PageNum%2==0?Math.ceil(PageNum/2)+1:Math.ceil(PageNum/2)
var PageNum_3=PageNum%2==0?Math.ceil(PageNum/2):Math.ceil(PageNum/2)+1
var strC="",startPage,endPage;
if (PageNum>=PagesLen) {startPage=0;endPage=PagesLen-1}
else if (nowPage<PageNum_2){startPage=0;endPage=PagesLen-1>PageNum?PageNum:PagesLen-1}//首页
else {startPage=nowPage+PageNum_3>=PagesLen?PagesLen-PageNum-1: nowPage-PageNum_2+1;var t=startPage+PageNum;endPage=t>PagesLen?PagesLen-1:t}
for (var i=startPage;i<=endPage;i++){
 if (i==nowPage){strC+='<a href="###" style="font-weight:700;" onclick="upPage2('+i+',\''+rongqi+'\','+dxname+',\''+dxname+'\')">'+(i+1)+'</a> '; }
 else {strC+='<a href="###" onclick="upPage2('+i+',\''+rongqi+'\','+dxname+',\''+dxname+'\')">'+(i+1)+'</a> '; }
 
}
if(nowPage==PagesLen-1)
strE='<a>下一页</a>  '
else
strE=' <a href="###" onclick="upPage2('+(nowPage+1)+',\''+rongqi+'\','+dxname+',\''+dxname+'\')">下一页</a>  '
strE2=nowPage+1+"/"+PagesLen+"页"+"  共"+j+"条"
document.getElementById(rongqi).innerHTML=strS+strC+strE+strE2


}

</script>

原创粉丝点击