javascript 实现分页

这是我参考别人的分页后
自己写了个跟简单的分页

 

js 代码

< html>

< body>

< span id=contents>
< span id=splitpage>

< script type="text/javascript">

_currentPage = 2;//设置当前页码
_indexContainer = document.all.splitpage;//设置存放分页索引号的容器
_contentContainer = document.all.contents;//设置存放分页内容的容器
_totalPages = 0;//初始化总页数
(function pageLoad() {
    _indexContainer.innerHTML =pageNo(100,2,10,7).join(" ");
    var str="getR("+3+")";
goToPage(100, 3, 10,7,str);
})();

//返回页码对象
function pageNo(counts, currentPage, perPage,showIndex,str) {
    var perPage = perPage ? perPage : 5;

    var pages=0;
    pages=counts/perPage+1;
    var pageIndex = [];
    //插入第一页标识
    if(currentPage==1){
        pageIndex.push("《《 《 ");
    }else{//注意这里是 A标签 我把前面的<去掉了 因为 加上后会让系统会自动识别成连接无法正常显示代码
        var str1="a href=\"javascript:goToPage("+counts+", "+1+", "+perPage+","+showIndex+",'"+str+"')\">《《 a href=\"javascript:goToPage("+counts+", "+(currentPage-1>0?currentPage-1:1)+", "+perPage+","+showIndex+",'"+str+"')\">《 ";
        pageIndex.push(str1);
    }

    var cyclCousnts=parseInt(showIndex/2);

for(var i=1;i<=showIndex;i++){
        var tmpPage=currentPage>=cyclCousnts?currentPage-cyclCousnts+i-1:i;
        if(currentPage==tmpPage)
            pageIndex.push("font color=\"red\">"+tmpPage+"");
        else if(tmpPage>pages)
            continue;
        else if(tmpPage<1)
            continue;
        else{//注意这里是 A标签 我把前面的<去掉了 因为 加上后会让系统会自动识别成连接无法正常显示代码
            var str1="a href=\"javascript:goToPage("+counts+", "+tmpPage+", "+perPage+","+showIndex+",'"+str+"')\">"+tmpPage+"";
            pageIndex.push(str1);
        }
    }
    if(currentPage==pages){
        pageIndex.push(" 》 》》");
    }else{//注意这里是 A标签 我把前面的<去掉了 因为 加上后会让系统会自动识别成连接无法正常显示代码
        var str1="a href=\"javascript:goToPage("+counts+", "+(currentPage+1>pages?currentPage:currentPage+1)+", "+perPage+","+showIndex+",'"+str+"')\">》  a href=\"javascript:goToPage("+counts+", "+pages+", "+perPage+","+showIndex+",'"+str+"')\">》》 ";
        pageIndex.push(str1);
    }

    return pageIndex;
}


function goToPage(counts, currentPage, perPage,showIndex,str) {
    _contentContainer.innerHTML = eval(str);
    _indexContainer.innerHTML = pageNo(counts, currentPage, perPage,showIndex,str).join(" ");
}

function getRecord(currentPage){
    return "the current pagaea  is:"+currentPage;
}

function getR(currentPage){
    return "the current page  by eval is:"+currentPage;
}

< /script>
< /body>
< /html>

评论

3 楼 笨笨狗 2007-05-28  

ajax分页，可以参考下我的文章：

http://www.iteye.com/topic/79869

实现了三种数据获取方式，利用Prototype框架实现OO对象设计，欢迎指正：）

2 楼 liuzongan 2007-05-28  

怎么显示不出来职?

1 楼 hgq0011 2007-05-22  

能够有一个很好的demo演示吗？
排版能更好一点吗？