express分页功能,之前也写过类似的php分页功能《php简单分页》
这里也做了一下node.js分页,写法都不一样,但思路基本都相同,这里总结归来一下不过运用哪里语言都通用。
效果如图:

教程都以上图效果为准。
1,“首页”功能简单,“上一页”功能在获取当前页码的时减去1就行,“下一页”功能在获取当前页基础上加1。
2,“尾页”,总共数据条数 除以 一页要显示的条数 就得到了一共多少页。得出的结果有余数,要向整数加1。
3,“跳转到某页”功能利用js的window.location.href功能即可。
4,页码的显示和省略号显示:

(1)初始化状态要判断数据数否满足了5页,如果有那么就用5后面的省略号,如果正好是5页或者小于5页则没有。
(2)点击大于3的页码时才开始判断,以下的判断都要以当前的页码为基准来判断。

当点击5时,判断什么情况下会出现左边省略号和又边省略号如: (当前页-3)>0 && 当前页+2<总页码

接着判断只显示左省略号的出现,当前页+2==last_page
这时候如果点了7或者8页时就会出错, 这时候应该判断:总页码-2<当前页 && 当前页<=总页码
———————————————————————————————-
下面贴出基于 jade+mongodb写的分页
前台逻辑:
div#page a(href="/") 首页 if current_page==1 a(href="/1") 上一页 else a(href="/#{current_page-1}") 上一页 if last_page<=5 - for (var i = 1; i <= 5; i++) a(href="#{i}") #{i} else if current_page<=3 - for (var i = 1; i <= 5; i++) a(href="#{i}") #{i} span ... if current_page>3 if (current_page-3)>0 && current_page+2<last_page span ... - for (var i = current_page-2; i <= current_page+2; i++) a(href="#{i}") #{i} span ... if current_page+2==last_page span ... - for (var i = current_page-2; i <= current_page+2; i++) a(href="#{i}") #{i} if last_page-2<current_page && current_page<=last_page span ... - for (var i = last_page-2; i <= last_page; i++) a(href="#{i}") #{i} if current_page==last_page a(href="/#{last_page}") 下一页 else a(href="/#{current_page+1}") 下一页 a(href="/#{last_page}") 尾页 span 共#{last_page}页 | ----跳转到第 input(type="text" value="")#page_num | 页 button#up_page 确定 | <br>
跳转到某页功能:
$('#up_page').click(function () { if( #{last_page}<$('#page_num').val() ){ window.location.href='/'+#{last_page}; } if( $('#page_num').val()<=0 ) { window.location.href='/1'; }else{ window.location.href='/'+$('#page_num').val(); } });
后台逻辑:
//首页内容 router.get('/', function(req, res, next) { MongoClient.connect(DB_CONN_STR, function(err1, db) { if(err1){ console.log('连接数据库失败'); }else{ db.collection('post').find().toArray(function (err1,result1) { if(err1){ console.log('插入数据失败'); }else{ if(parseFloat(req.params.page_num)<=0){ req.params.page_num=1; var num=parseFloat(req.params.page_num); console.log('执行了-------------------'); } if(parseFloat(req.params.page_num)>=Math.ceil(((result1).length)/5)){ req.params.page_num=Math.ceil(((result1).length)/5); var num=parseFloat(req.params.page_num); } else{ var num=parseFloat(req.params.page_num); } db.collection('post').find({} ,{skip:0,limit:5, sort: [['_id',1]]}).toArray(function (err2,result2) { if(err2){ console.log('插入数据失败'); }else{ res.render('index', { title: '首页', result:result2, current_page:parseFloat(req.params.p)?parseFloat(req.params.p):1, page_total:result1.length, last_page:Math.ceil((result1.length)/5) }); } }); } }); } }); }); //首页内容 router.get('/:p', function(req, res, next) { // var num=parseFloat(req.params.p); MongoClient.connect(DB_CONN_STR, function(err1, db) { if(err1){ console.log('连接数据库失败'); }else{ db.collection('post').find().toArray(function (err1,result1) { if(err1){ console.log('插入数据失败'); }else{ if(parseFloat(req.params.p)<=0){ req.params.p=1; var num=parseFloat(req.params.p); console.log('执行了-------------------'); } if(parseFloat(req.params.p)>=Math.ceil(((result1).length)/5)){ req.params.p=Math.ceil(((result1).length)/5); var num=parseFloat(req.params.p); } else{ var num=parseFloat(req.params.p); } db.collection('post').find({} ,{skip:(num-1)*5,limit:5, sort: [['_id',1]]}).toArray(function (err2,result) { if(err2){ console.log('插入数据失败'); }else{ res.render('index', { title: '首页', result:result, current_page:parseFloat(req.params.p)?parseFloat(req.params.p):1, //获取到当前页码 page_total:result.length, //总条数据 last_page:Math.ceil(((result1).length)/5) }); } }); } }); } }); });
数据库结构情况
