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 相关文章推荐
js操作ajax返回的json的注意问题!
Feb 23 Javascript
Js表格万条数据瞬间加载实现代码
Feb 20 Javascript
jquery+html5时钟特效代码分享(可设置闹钟并且语音提醒)
Mar 30 Javascript
网页从弹窗页面单选框传值至父页面代码分享
Sep 29 Javascript
Javascript实现信息滚动效果
May 18 Javascript
使用express搭建一个简单的查询服务器的方法
Feb 09 Javascript
10分钟彻底搞懂Http的强制缓存和协商缓存(小结)
Aug 30 Javascript
webpack之引入图片的实现及问题
Oct 08 Javascript
4个顶级JavaScript高级文本编辑器
Oct 10 Javascript
JS实现判断有效的数独算法示例
Feb 25 Javascript
vue中v-text / v-html使用实例代码详解
Apr 02 Javascript
vue-quill-editor的使用及个性化定制操作
Aug 04 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
用PHP调用Oracle存储过程的方法
2008/09/12 PHP
Ext.data.PagingMemoryProxy分页一次性读取数据的实现代码
2010/04/07 PHP
PHP实现将textarea的值根据回车换行拆分至数组
2015/06/10 PHP
php 实现一个字符串加密解密的函数实例代码
2016/11/01 PHP
PHP生成唯一ID之SnowFlake算法
2016/12/17 PHP
php学习笔记之mb_strstr的基本使用
2018/02/03 PHP
node.js中的path.resolve方法使用说明
2014/12/08 Javascript
实例详解angularjs和ajax的结合使用
2015/10/22 Javascript
jQuery Easyui 下拉树组件combotree
2016/12/16 Javascript
完美解决node.js中使用https请求报CERT_UNTRUSTED的问题
2017/01/08 Javascript
JavaScript中附件预览功能实现详解(推荐)
2017/08/15 Javascript
浅谈HTTP 缓存的那些事儿
2018/10/17 Javascript
原生JS实现贪吃蛇小游戏
2020/03/09 Javascript
如何优雅地取消 JavaScript 异步任务
2020/03/22 Javascript
vue $mount 和 el的区别说明
2020/09/11 Javascript
对vue生命周期的深入理解
2020/12/03 Vue.js
[01:05:30]VP vs TNC 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
Python创建日历实例
2014/08/21 Python
Python错误提示:[Errno 24] Too many open files的分析与解决
2017/02/16 Python
Django基础三之视图函数的使用方法
2019/07/18 Python
Python3 requests文件下载 期间显示文件信息和下载进度代码实例
2019/08/16 Python
django框架F&amp;Q 聚合与分组操作示例
2019/12/12 Python
解决Python pip 自动更新升级失败的问题
2020/02/21 Python
django xadmin action兼容自定义model权限教程
2020/03/30 Python
Python基于numpy模块实现回归预测
2020/05/14 Python
Html5原生拖拽相关事件简介以及基础实现
2020/11/19 HTML / CSS
Mytheresa英国官网:拥有160多个奢侈品品牌
2016/10/09 全球购物
小学少先队活动方案
2014/02/18 职场文书
学校党委副书记个人对照检查材料思想汇报
2014/09/28 职场文书
贷款担保书
2015/01/20 职场文书
公司内部升职自荐信
2015/03/27 职场文书
2015年车间主任工作总结
2015/05/21 职场文书
中秋节祝酒词
2015/08/12 职场文书
css position fixed 左右双定位的实现代码
2021/04/29 HTML / CSS
JavaScript canvas实现流星特效
2021/05/20 Javascript
详解CSS伪元素的妙用单标签之美
2021/05/25 HTML / CSS