码迷,mamicode.com
首页 > Web开发 > 详细

JS实现分页

时间:2020-12-07 11:51:11      阅读:8      评论:0      收藏:0      [点我收藏+]

标签:page   取整   color   break   四舍五入   fun   ceil   parse   first   

 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 }

 

JS实现分页

标签:page   取整   color   break   四舍五入   fun   ceil   parse   first   

原文地址:https://www.cnblogs.com/donleo123/p/14070378.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!