ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

JS实现分页

2020-12-01 20:05:35  阅读:157  来源: 互联网

标签:pageNum 分页 pageSize 实现 当前页 JS num let 跳转


 1 /**
 2  * 获取分页
 3  *
 4  *   js中取整
 5  *   1、取整  parseInt(5/2)  // 2
 6  *   2、向上取整  Math.ceil(5/2)  // 3
 7  *   3、向下取整  Math.floor(5/2)  // 2
 8  *   4、四舍五入  Math.round(5/2)     //3
 9  *   5、取余      6%4               /2
10  */
11 function getPage(type) {
12 
13     //获取文本对象
14     let getPageNum = $("#pageNum");
15     let getPageSize = $("#pageSize");
16 
17     let pageNum = 0;
18     //获得当前页
19     let numStr = getPageNum.val().trim();
20     let num = numStr == null || numStr === "" ? 
21                 1 : parseInt(numStr);
22     //如果当前输入页小于1,跳转到首页,否则跳转到当前页
23     num = num < 1 ? 1 : num;
24     //取得页面上的总条数,用.html获取值
25     let count = $("#pageCount").html();
26     let pageCount = count == null || count === "" ? 
27             1 : parseInt(count);
28     //取得当前页码显示多少条
29     let size = getPageSize.val().trim();
30     let pageSize = size == null || size === "" ? 
31             1 : parseInt(size);
32     //如果当前输入显示条数小于1,一页显示10条,否则显示当前页
33     pageSize = pageSize < 1 ? 10 : pageSize;
34     //算出总页数
35     let endPage = Math.ceil(pageCount / pageSize);
36     switch (type) {
37         //跳转
38         case 'jump':
39             //如果当前页大于尾页,跳转到最后一页,否则跳转到当前页
40             if (num > endPage) {
41                 pageNum = endPage;
42             } else {
43                 pageNum = num;
44             }
45             break;
46         //首页
47         case 'first':
48             pageNum = 1;
49             break;
50         //上一页
51         case 'previous':
52             pageNum = num;
53             if (pageNum > 1) {
54                 --pageNum;
55             }
56             break;
57         //下一页
58         case 'next':
59             pageNum = num;
60             //判断下一页是否为尾页
61             if (endPage !== pageNum) {
62                 ++pageNum
63             }
64             break;
65         //尾页
66         case 'last':
67             //算出总页数
68             pageNum = Math.ceil(pageCount / pageSize);
69             break;
70     }
71 
72     //设置当前页数和显示条数
73     getPageNum.val(pageNum);
74     getPageSize.val(pageSize);
75     findAll();
76 }

 

标签:pageNum,分页,pageSize,实现,当前页,JS,num,let,跳转
来源: https://www.cnblogs.com/donleo123/p/14070378.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有