NodeJS和BootStrap分页效果的实现代码


Posted in NodeJs onNovember 07, 2016

1、数据处理

首先在动态js中,根据url参数获取数据库文档的数量,设置分页的大小,获取当前页面的数据,然后将文档数量pagecount,分页大小pagesize,以及当前页面currentpage传递到页面中。

2、处理分页效果

我采用的是JavaScript动态生成的,你也可以利用ejs支持函数的特性将其封装后生成html形式的分页。

首先,添加分页ul,在你的页面中需要显示的位置添加代码:

<ul class="pagination" id="pagination">
</ul>

然后在script标签中插入处理分页的代码:

$(document).ready(function() {
if($("#pagination")){
var pagecount = <%= locals.pagecount %>;
var pagesize = <%= locals.pagesize %>;
var currentpage = <%= locals.currentpage %>;
var counts,pagehtml="";
if(pagecount%pagesize==0){
counts = parseInt(pagecount/pagesize);
}else{
counts = parseInt(pagecount/pagesize)+1;
}
//只有一页内容
if(pagecount<=pagesize){pagehtml="";}
//大于一页内容
if(pagecount>pagesize){
if(currentpage>1){
pagehtml+= '<li><a rel="external nofollow" href="/course/index/'+(currentpage-1)+'">上一页</a></li>';
}
for(var i=0;i<counts;i++){
if(i>=(currentpage-3) && i<(currentpage+3)){
if(i==currentpage-1){
pagehtml+= '<li class="active"><a rel="external nofollow" href="/course/index/'+(i+1)+'">'+(i+1)+'</a></li>';
}else{
pagehtml+= '<li><a rel="external nofollow" href="/course/index/'+(i+1)+'">'+(i+1)+'</a></li>';
}

}
}
if(currentpage<counts){
pagehtml+= '<li><a rel="external nofollow" href="/course/index/'+(currentpage+1)+'">下一页</a></li>';
}
}
$("#pagination").html(pagehtml);
}
});

注意:locals.pagecount,locals.pagesize,locals.currentpage分别是数据库数量,分页大小,当前分页,他们是从js中传递过来的,当然,你也可以直接修改它们为固定的数据测试下效果。

比如:

NodeJS和BootStrap分页效果的实现代码

实际效果为:

NodeJS和BootStrap分页效果的实现代码

这样一个简单的分页效果就出来了

以上所述是小编给大家介绍的NodeJS和BootStrap分页效果的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

NodeJs 相关文章推荐
nodejs实用示例 缩址还原
Dec 28 NodeJs
nodejs的require模块(文件模块/核心模块)及路径介绍
Jan 14 NodeJs
Nodejs使用mysql模块之获得更新和删除影响的行数的方法
Mar 18 NodeJs
nodejs教程之环境安装及运行
Nov 21 NodeJs
nodejs URL模块操作URL相关方法介绍
Mar 03 NodeJs
详解Nodejs基于mongoose模块的增删改查的操作
Dec 21 NodeJs
浅谈Nodejs中的作用域问题
Dec 26 NodeJs
win系统下nodejs环境安装配置
May 04 NodeJs
nodejs处理图片的中间件node-images详解
May 08 NodeJs
nodejs中方法和模块用法示例
Dec 24 NodeJs
linux 下以二进制的方式安装 nodejs
Feb 12 NodeJs
nodejs+express最简易的连接数据库的方法
Dec 23 NodeJs
NodeJS使用formidable实现文件上传
Oct 27 #NodeJs
nodejs简单实现操作arduino
Sep 25 #NodeJs
NodeJs读取JSON文件格式化时的注意事项
Sep 25 #NodeJs
nodejs微信公众号支付开发
Sep 19 #NodeJs
nodeJs内存泄漏问题详解
Sep 05 #NodeJs
浅谈Nodejs应用主文件index.js
Aug 28 #NodeJs
NodeJS远程代码执行
Aug 28 #NodeJs
You might like
用session做客户验证时的注意事项
2006/10/09 PHP
PHPMailer安装方法及简单实例
2008/11/25 PHP
PHP独立Session数据库存储操作类分享
2014/06/11 PHP
PHP实现绘制3D扇形统计图及图片缩放实例
2014/10/01 PHP
js 实现复制到粘贴板的功能代码
2010/05/13 Javascript
jquery遍历数组与筛选数组的方法
2013/11/05 Javascript
纯JS实现根据CSS的class选择DOM
2014/03/22 Javascript
jquery 设置style:display的方法
2015/01/29 Javascript
使用js复制链接中的部分文字的方法
2015/07/30 Javascript
js实现文本框只允许输入数字并限制数字大小的方法
2015/08/19 Javascript
BootstrapTable与KnockoutJS相结合实现增删改查功能【二】
2016/05/10 Javascript
关于JS变量和作用域详解
2016/07/28 Javascript
微信小程序 刷新上拉下拉不会断详细介绍
2017/05/11 Javascript
jquery请求servlet实现ajax异步请求的示例
2017/06/03 jQuery
vue中element-ui表格缩略图悬浮放大功能的实例代码
2018/06/26 Javascript
微信小程序局部刷新触发整页刷新效果的实现代码
2018/11/21 Javascript
JS原型与继承操作示例
2019/05/09 Javascript
一个手写的vue放大镜效果
2019/08/09 Javascript
layui异步加载table表中某一列数据的例子
2019/09/16 Javascript
JavaScript装箱及拆箱boxing及unBoxing用法解析
2020/06/15 Javascript
[13:18]《一刀刀一天》之DOTA全时刻21:详解TI新赛制 A队再露獠牙
2014/06/24 DOTA
跟老齐学Python之Python安装
2014/09/12 Python
Python中的默认参数详解
2015/06/24 Python
python画图系列之个性化显示x轴区段文字的实例
2018/12/13 Python
使用python实现回文数的四种方法小结
2019/11/24 Python
tensorflow中tf.slice和tf.gather切片函数的使用
2020/01/19 Python
tensorflow 固定部分参数训练,只训练部分参数的实例
2020/01/20 Python
html5 初试 indexedDB(推荐)
2016/07/21 HTML / CSS
Happy Plugs官网:瑞典无线耳机品牌
2020/07/16 全球购物
高中的自我鉴定
2013/12/16 职场文书
优秀通讯员事迹材料
2014/01/28 职场文书
质量标语大全
2014/06/12 职场文书
村道德模范事迹材料
2014/08/28 职场文书
PyQt5 显示超清高分辨率图片的方法
2021/04/11 Python
MySQL InnoDB ReplicaSet(副本集)简单介绍
2021/04/24 MySQL
Python使用random模块实现掷骰子游戏的示例代码
2021/04/29 Python