Javascript实现的分页函数


Posted in Javascript onFebruary 07, 2007

/**
 * 分页类构造
 * 参数 nTotalList: 总条数
 * 参数 nPageSize: 每页显示条数
 * 参数 nPageNum: 当前页码
 * 参数 sPageUrl: 分页链接的URL,页码以[pn]代替,输出时将被替换为实际页码
 * 参数 nPageListSize: 页码列表(下拉框)中显示的最多页码条数。该参数可省略,默认100
 */
function Pagination(nTotalList, nPageSize, nPageNum, sPageUrl, nPageListSize) {
  this.totalList = nTotalList;
  this.pageSize = nPageSize;
  this.pageNum = nPageNum;
  if (nTotalList == 0)
    this.totalPages = 1;
  else
    this.totalPages = Math.floor((this.totalList-1)/this.pageSize + 1);
  this.pageUrl = sPageUrl;
  if (arguments[4])
    this.pageListSize = nPageListSize;
  else
    this.pageListSize = 100;
}

/**
 * 生成分页,将HTML直接输出
 * 无参数
 * 无返回值
 */
Pagination.prototype.generate = function() {
  var output = "";
  output += "<table width=\"98%\" cellspacing=\"1\" cellpadding=\"3\" align=\"center\"><tr><td align=\"right\">";
  output += "共 " + this.totalList + " 条 每页 " + this.pageSize + " 条 当前第 ";
  output += "<select onchange=\"if(this.value)location.href='" + this.pageUrl + "'.replace(/\\[pn\\]/,";
  output += "this.value);\" align=\"absMiddle\" style=\"font:normal 9px Verdana,Arial,宋体;\">";
  var firstPage = this.pageNum - Math.floor(this.pageListSize/2);
  if (firstPage < 1)
    firstPage = 1;
  var lastPage = firstPage + this.pageListSize - 1;
  if (lastPage > this.totalPages) {
    lastPage = this.totalPages;
    firstPage = lastPage - this.pageListSize + 1;
    if (firstPage < 1)
      firstPage = 1;
  }
  if (firstPage > 1) {
    output += "<option value=\"1\">1</option>";
    if (firstPage > 2)
      output += "<option value=\"\">…</option>";
  }
  for (var p = firstPage; p <= lastPage; p++) {
    output += "<option value=\"" + p + "\"";
    if (p == this.pageNum)
      output += " selected=\"yes\"";
    output += ">" + p + "</option>";
  }
  if (lastPage < this.totalPages) {
    if (lastPage < this.totalPages - 1)
      output += "<option value=\"\">…</option>";
    output += "<option value=\"" + this.totalPages + "\">" + this.totalPages + "</option>";
  }
  if (this.pageNum > this.totalPages)
    output += "<option value=\"\" selected=\"yes\">页码超出范围</option>";
  output += "</select>";
  output += "/" + this.totalPages + " 页 ";
  if (this.pageNum == 1) {
    output += "[首页] ";
    output += "[上页] ";
  }
  else {
    output += "<a href=\"" + this.pageUrl.replace(/\[pn\]/, "1") + "\">[首页]</a> ";
    output += "<a href=\"" + this.pageUrl.replace(/\[pn\]/, this.pageNum-1) + "\">[上页]</a> ";
  }
  if (this.pageNum == this.totalPages) {
    output += "[下页] ";
    output += "[尾页]";
  }
  else {
    output += "<a href=\"" + this.pageUrl.replace(/\[pn\]/, this.pageNum+1) + "\">[下页]</a> ";
    output += "<a href=\"" + this.pageUrl.replace(/\[pn\]/, this.totalPages) + "\">[尾页]</a> ";
  }
  output += "</td></tr></table>";
  document.writeln(output);
}

Javascript 相关文章推荐
6款新颖的jQuery和CSS3进度条插件推荐
Mar 05 Javascript
javascript中的delete使用详解
Apr 11 Javascript
jquery清空表单数据示例分享
Feb 13 Javascript
按Enter键触发事件的jquery方法实现代码
Feb 17 Javascript
浅析四种常见的Javascript声明循环变量的书写方式
Oct 14 Javascript
JS创建事件的三种方法(实例代码)
May 12 Javascript
js基于cookie方式记住返回页面用法示例
May 27 Javascript
jQuery ajax应用总结
Jun 02 Javascript
jQuery实现切换隐藏与显示同时切换图标功能
Oct 29 jQuery
利用hasOwnProperty给数组去重的面试题分享
Nov 05 Javascript
JavaScript常见继承模式实例小结
Jan 11 Javascript
详解Vue中使用Axios拦截器
Apr 22 Javascript
[转]JS宝典学习笔记
Feb 07 #Javascript
HTML页面如何象ASP一样接受参数
Feb 07 #Javascript
DOM相关内容速查手册
Feb 07 #Javascript
索趣科技的答案
Feb 07 #Javascript
JS模拟多线程
Feb 07 #Javascript
使用prototype.js进行异步操作
Feb 07 #Javascript
最新优化收藏到网摘代码(digg,diigo)
Feb 07 #Javascript
You might like
农民C键的运用技巧
2020/03/04 星际争霸
php安全开发 添加随机字符串验证,防止伪造跨站请求
2013/02/14 PHP
php生成gif动画的方法
2015/11/05 PHP
Nginx环境下PHP flush失效的解决方法
2016/10/19 PHP
使用正则替换变量
2007/05/05 Javascript
JQuery DataTable删除行后的页面更新利用Ajax解决
2013/05/17 Javascript
jQuery学习笔记之 Ajax操作篇(二) - 数据传递
2014/06/23 Javascript
javascript实现单击和双击并存的方法
2014/12/13 Javascript
js控制文本框只输入数字和小数点的方法
2015/03/10 Javascript
jQuery中 attr() 方法使用小结
2015/05/03 Javascript
js实现卡片式项目管理界面UI设计效果
2015/12/08 Javascript
CascadeView级联组件实现思路详解(分离思想和单链表)
2016/04/12 Javascript
深入理解JavaScript 函数
2016/06/06 Javascript
浅谈jQuery中事情的动态绑定
2017/02/12 Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
2017/02/13 Javascript
jquery实现超简单的瀑布流布局【推荐】
2017/03/08 Javascript
sublime text配置node.js调试(图文教程)
2017/11/23 Javascript
JS实现左边列表移到到右边列表功能
2018/03/28 Javascript
最后说说Vue2 SSR 的 Cookies 问题
2018/05/25 Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
2019/07/26 jQuery
Node.js文本文件BOM头的去除方法
2020/11/22 Javascript
[01:06:18]DOTA2-DPC中国联赛 正赛 Phoenix vs Dynasty BO3 第二场 1月26日
2021/03/11 DOTA
Python使用函数默认值实现函数静态变量的方法
2014/08/18 Python
Linux CentOS7下安装python3 的方法
2018/01/21 Python
python使用正则筛选信用卡
2019/01/27 Python
python实现图片横向和纵向拼接
2020/03/05 Python
Python 随机按键模拟2小时
2020/12/30 Python
大一自我鉴定范文
2013/10/04 职场文书
生产班组长岗位职责
2014/01/05 职场文书
学生实习介绍信
2014/01/15 职场文书
优秀安全员事迹材料
2014/05/11 职场文书
求职信怎么写
2014/05/23 职场文书
2015暑期社会实践调查报告
2015/07/14 职场文书
python使用glob检索文件的操作
2021/05/20 Python
苹果M1芯片安装nginx 并且部署vue项目步骤详解
2021/11/20 Servers
小喇叭开始广播了! 四十多年前珍贵老照片
2022/05/09 无线电