JS 分页

happen 发布于2019-06-27 10:39 / 2616人阅读

摘要：分页函数页数每页显示记录数分页部分是从真实数据行开始，因而存在加减某个常数，以确定真正的记录数纯分页实质是数据行全部加载，通过是否显示属性完成分页功能表格行数总页数每页显示行数当前页数开始显示的行结束显示的行前行始终显示

/**
* 分页函数
* pno--页数
* psize--每页显示记录数
* 分页部分是从真实数据行开始，因而存在加减某个常数，以确定真正的记录数
* 纯js分页实质是数据行全部加载，通过是否显示属性完成分页功能
**/

function goPage(pno,psize,strvar){

    var itable = document.getElementById("tableId");    
    var num = itable.rows.length;//表格行数 
    var totalPage = 0;//总页数
    var pageSize = psize;//每页显示行数
    if((num-1)/pageSize > parseInt((num-1)/pageSize)){ 

        totalPage=parseInt((num-1)/pageSize)+1; 
    }else{ 
        totalPage=parseInt((num-1)/pageSize);
    }   

    var currentPage = pno;//当前页数

    var startRow = (currentPage - 1) * pageSize+1;//开始显示的行   

   var endRow = currentPage * pageSize+1;//结束显示的行   

   endRow = (endRow > num)? num : endRow;
    //前n行始终显示

    for(i=0;i<1;i++){
        var irow = itable.rows[i];
        irow.style.display = "";
    }
    for(var i=1;i=startRow&&i共"+(num-1)+"条记录 
共"+totalPage+"页 
当前第"+currentPage+"页

";
    tempStr += "

";

if(currentPage>1){
    tempStr += "上一页"

}else{
    tempStr += "上一页";   
}

if(currentPage下一页";

}else{
    tempStr += "下一页";

}
if(currentPage>1){
    tempStr += "首页";
}else{
    tempStr += "首页";
}
if(currentPage尾页";
}else{
    tempStr += "尾页";
}
tempStr +="

";
    document.getElementById(strvar+"_pageStr").innerHTML = tempStr;
}

云服务器 GPU云服务器 js分页 js分页控件 JS分页展示 js实现分页

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/20722.html

小程序分页实践：编写可复用分页组件

摘要：项目中遇到切换列表，每个都需要分页的需求，分页流程具有相似性，于是想将分页封装为组件，方便应用。组件的复用完成了以上组件，在对其他分页的页面，可以直接复用。项目中遇到 tab切换列表，每个tab都需要分页的需求，分页流程具有相似性，于是想将分页封装为组件，方便应用。组件的应用已写成一个小demo，效果如下图所示（数据用mock模拟）： showImg(https://segment...

crelaber 2019-08-26 10:11 评论0 收藏0
一步步实现thinkphp上的ajax无刷新分页

摘要：信息列表循环赋值分页信息部分这一步是实现无刷新分页的重点，用到了的通信，通过与数据库的交互，将获取到的数据写到模板中，替换掉之前的数据集，达到分页的目的。前言 thinkphp框架自带的分页类是每次翻页都要刷新一下整个页面，这种翻页的用户体验显然是不太理想的，我们希望每次翻页只刷新我们想要的数据集部分的数据，这样我们很容易想到ajax异步通信，用ajax与数据库（本人在开发过程中使用...

张迁 2019-06-27 14:04 评论0 收藏0
react中后台管理界面

摘要：是一个用开发的一个企业级中后台管理包含常用的业务，组件，及数据流转方案，前后端分离的开发方式，按业务划分的目录结构，可以大大提高我们的开发效率下面是整体的介绍，感兴趣的同学可以去官网详加了解。 dva-boot-admin 是一个用React开发的一个企业级中后台管理UI,包含常用的业务，组件，及数据流转方案，前后端分离的开发方式，按业务划分的目录结构，可以大大提高我们的开发效率下面...

dongfangyiyu 2019-08-26 11:54 评论0 收藏0
JS 分页

摘要：分页函数页数每页显示记录数分页部分是从真实数据行开始，因而存在加减某个常数，以确定真正的记录数纯分页实质是数据行全部加载，通过是否显示属性完成分页功能表格行数总页数每页显示行数当前页数开始显示的行结束显示的行前行始终显示 /** * 分页函数 * pno--页数 * psize--每页显示记录数 * 分页部分是从真实数据行开始，因而存在加减某个常数，以确定真正的记录数 * 纯...

AlphaWatch 2019-08-19 14:40 评论0 收藏0
JS 分页

摘要：分页函数页数每页显示记录数分页部分是从真实数据行开始，因而存在加减某个常数，以确定真正的记录数纯分页实质是数据行全部加载，通过是否显示属性完成分页功能表格行数总页数每页显示行数当前页数开始显示的行结束显示的行前行始终显示 /** * 分页函数 * pno--页数 * psize--每页显示记录数 * 分页部分是从真实数据行开始，因而存在加减某个常数，以确定真正的记录数 * 纯...

PiscesYE 2019-08-01 14:36 评论0 收藏0
kPagination纯js实现分页插件

摘要：分页插件纯分页插件，压缩版本，样式可以自定义使用方法当前页跳转配置项选项类型说明可以显示的按钮个数是否显示上一页按钮是否显示下一页按钮是否显示跳转输入框跳转按钮的文字页面触发回调重新渲染成功回调可选样式选项说明分页容器样式按钮容 kPagination分页插件纯js分页插件，压缩版本~4kb，样式可以自定义 demo 使用方法 new kPagination({ ...

Sanchi 2019-08-26 12:09 评论0 收藏0