前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >javascript本地分页

javascript本地分页

作者头像
Petrochor
发布2022-06-07 15:27:39
3120
发布2022-06-07 15:27:39
举报
文章被收录于专栏:StephenStephen

注意:本地分页适用于数据量小的地方,如果数据量大,不建议使用本地分页

代码语言:javascript
复制
var iTable = document.getElementById("iTable");
var rows = iTable.rows.length;
var pageSize = 3;//每页显示条数
var pageNum = 0;//总页数
var current = 1;
if(rows/pageSize > parseInt(rows/pageSize)){
    pageNum = parseInt(rows/pageSize)+1;
}else{
    pageNum = rows/pageSize;
}
	
function toPage(current){
    var startRow = (current-1)*pageSize+1;
    var endRow = current*pageSize;
    for(var i=1;i<(rows+1);i++){
        var iRow = iTable.rows[i-1];
        if(i>=startRow && i<=endRow){
            iRow.style.display="table-row";
        }else{
            iRow.style.display="none";
        }
    }

    var pageHtml = "<li>当前"+current+"页/共"+pageNum+"页</li>";
    if(current == 1){
        pageHtml = pageHtml + "<li class='disabled'>首页</li>";
        pageHtml = pageHtml + "<li class='disabled'>上一页</li>";
    }else{
        pageHtml = pageHtml + "<li><a onClick='toPage(1)'>首页</a></li>";
        pageHtml = pageHtml + "<li><a onClick='toPage("+(current-1)+")'>上一页</a></li>";
    }
    if(current == pageNum){
        pageHtml = pageHtml + "<li class='disabled'>下一页</li>";
        pageHtml = pageHtml + "<li class='disabled'>尾页</li>";
    }else{
        pageHtml = pageHtml + "<li><a onClick='toPage("+(current+1)+")'>下一页</a></li>";
        pageHtml = pageHtml + "<li><a onClick='toPage("+pageNum+")'>尾页</a></li>";
    }
    document.getElementById("pagination").innerHTML=pageHtml;
}
toPage(1);
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2017-08-16 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档