首页
所有分类
TAGS
文字工具 EMOJI BIBLE
编程 Javascript

[JS源码]超长文章自动分页（客户端版）

Posted in Javascript onJanuary 09, 2007 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
<HTML>  
<HEAD>  
<TITLE> New Document </TITLE>  
<META NAME="Generator" CONTENT="EditPlus">  
<META NAME="Author" CONTENT="">  
<META NAME="Keywords" CONTENT="">  
<META NAME="Description" CONTENT="">  
<style>  
* {  
font-size:10.2pt;  
font-family:tahoma;  
line-height:150%;  
}  
.divContent  
{  
border:1px solid red;  
background-color:#FFD2D3;  
width:500px;  
word-break:break-all;  
margin:10px 0px 10px;  
padding:10px;  
}  
</style>  
</HEAD>  
<BODY>  
header  
<div id="divPagenation"></div>  
<div id="divContent"></div>  
footer  
<SCRIPT LANGUAGE="JavaScript">  
<!--  
s="<p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p><p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p><p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p><p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p><p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p>";  // 封装DHTMLpagenation  
function DHTMLpagenation(content) { with (this)  
{  
  // client static html file pagenation  
  // Scipit by blueDestiny,never-online, www.never-online.net  
  this.content=content; // 内容  
  this.contentLength=content.length; // 内容长度  
  this.pageSizeCount; // 总页数  
  this.perpageLength=100; //default perpage byte length.  
  this.currentPage=1; // 起始页为第1页  
  //this.regularExp=/.+[\?\&]{1}page=(\d+)/;  
  this.regularExp=/\d+/; // 建立正则表达式，匹配数字型字符串。  
  this.divDisplayContent;  
  this.contentStyle=null;  
  this.strDisplayContent="";  
  this.divDisplayPagenation;  
  this.strDisplayPagenation="";  
  // 把第二个参数赋给perpageLength;  
  arguments.length==2?perpageLength=arguments[1]:'';  
  try {  
    divExecuteTime=document.createElement("DIV");  
    document.body.appendChild(divExecuteTime);  
  }  
  catch(e)  
  {  
  }  
  // 得到divPagenation容器。  
  if(document.getElementById("divPagenation"))  
  {  
    divDisplayPagenation=document.getElementById("divPagenation");  
  }  
  else  
  {  
    try  
    {  
      divDisplayPagenation=document.createElement("DIV");  
      divDisplayPagenation.id="divPagenation";  
      document.body.appendChild(divDisplayPagenation);  
    }  
    catch(e)  
    {  
      return false;  
    }  
  }  
  // 得到divContent容器  
  if(document.getElementById("divContent"))  
  {  
    divDisplayContent=document.getElementById("divContent");  
  }  
  else  
  {  
    try  
    {  
      divDisplayContent=document.createElement("DIV");  
      divDisplayContent.id="divContent";  
      document.body.appendChild(divDisplayContent);  
    }  
    catch(e)  
    {  
      return false;  
    }  
  }  
  DHTMLpagenation.initialize();  
  return this;  
}};  
//初始化分页；  
//包括把加入CSS，检查是否需要分页  
DHTMLpagenation.initialize=function() { with (this)  
{  
  divDisplayContent.className=contentStyle!=null?contentStyle:"divContent";  
  if(contentLength<=perpageLength)  
  {  
    strDisplayContent=content;  
    divDisplayContent.innerHTML=strDisplayContent;  
    return null;  
  }  
  pageSizeCount=Math.ceil((contentLength/perpageLength));  
  DHTMLpagenation.goto(currentPage);  
  DHTMLpagenation.displayContent();  
}};  
//显示分页栏  
DHTMLpagenation.displayPage=function() { with (this)  
{  
  strDisplayPagenation="分页：";  
  if(currentPage&¤tPage!=1)  
    strDisplayPagenation+='<a href="javascript:void(0)" onclick="DHTMLpagenation.previous()">上一页</a>  ';  
  else  
    strDisplayPagenation+="上一页  ";  
  for(var i=1;i<=pageSizeCount;i++)  
  {  
    if(i!=currentPage)  
      strDisplayPagenation+='<a href="javascript:void(0)" onclick="DHTMLpagenation.goto('+i+');">'+i+'</a>  ';  
    else  
      strDisplayPagenation+=i+"  ";  
  }  
  if(currentPage&¤tPage!=pageSizeCount)  
    strDisplayPagenation+='<a href="javascript:void(0)" onclick="DHTMLpagenation.next()">下一页</a>  ';  
  else  
    strDisplayPagenation+="下一页  ";  
  strDisplayPagenation+="共 " + pageSizeCount + " 页，每页" + perpageLength + " 字符，调整字符数：<input type='text' value='"+perpageLength+"' id='ctlPerpageLength'><input type='button' value='确定' onclick='DHTMLpagenation.change(document.getElementById(\"ctlPerpageLength\").value);'>";  
  divDisplayPagenation.innerHTML=strDisplayPagenation;  
}};  
//上一页  
DHTMLpagenation.previous=function() { with(this)  
{  
  DHTMLpagenation.goto(currentPage-1);  
}};  
//下一页  
DHTMLpagenation.next=function() { with(this)  
{  
  DHTMLpagenation.goto(currentPage+1);  
}};  
//跳转至某一页  
DHTMLpagenation.goto=function(iCurrentPage) { with (this)  
{  
  startime=new Date();  
  if(regularExp.test(iCurrentPage))  
  {  
    currentPage=iCurrentPage;  
    strDisplayContent=content.substr((currentPage-1)*perpageLength,perpageLength);  
  }  
  else  
  {  
    alert("page parameter error!");  
  }  
  DHTMLpagenation.displayPage();  
  DHTMLpagenation.displayContent();  
}};  
//显示当前页内容  
DHTMLpagenation.displayContent=function() { with (this)  
{  
  divDisplayContent.innerHTML=strDisplayContent;  
}};  
//改变每页的字节数  
DHTMLpagenation.change=function(iPerpageLength) { with(this)  
{  
  if(regularExp.test(iPerpageLength))  
  {  
    DHTMLpagenation.perpageLength=iPerpageLength;  
    DHTMLpagenation.currentPage=1;  
    DHTMLpagenation.initialize();  
  }  
  else  
  {  
    alert("请输入数字");  
  }  
}};  
// 接口API  
// DHTMLpagenation(strContent[,perpageLength])  
DHTMLpagenation(s,100);  
// Power By blueDestiny,never-online  
//-->  
</SCRIPT>  
</BODY>  
</HTML>

[JS源码]超长文章自动分页（客户端版）

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐
setTimeout和setInterval的区别你真的了解吗?
Mar 31 Javascript
JS构建页面的DOM节点结构的实现代码
Dec 09 Javascript
JS 事件绑定、事件监听、事件委托详细介绍
Sep 28 Javascript
深入浅析Vue组件开发
Nov 25 Javascript
JS利用正则表达式实现简单的密码强弱判断实例
Jun 16 Javascript
小发现之浅谈location.search与location.hash的问题
Jun 23 Javascript
Angular4绑定html内容出现警告的处理方法
Nov 03 Javascript
Vue瀑布流插件的使用示例
Sep 19 Javascript
微信小程序提取公用函数到util.js及使用方法示例
Jan 10 Javascript
使用 Vue cli 3.0 构建自定义组件库的方法
Apr 30 Javascript
深入理解Antd-Select组件的用法
Feb 25 Javascript
简单了解JavaScript弹窗实现代码
May 07 Javascript
Javascript与vbscript数据共享
Jan 09 #Javascript
In Javascript Class, how to call the prototype method.(three method)
Jan 09 #Javascript
js技巧--转义符&quot;\&quot;的妙用
Jan 09 #Javascript
客户端脚本中常常出现的一些问题和调试技巧
Jan 09 #Javascript
Javascript miscellanea -display data real time, using window.status
Jan 09 #Javascript
Javascript - HTML的request类
Jan 09 #Javascript
贴一个在Mozilla中常用的Javascript代码
Jan 09 #Javascript
TECSUN(1) 修复(2) 海燕B411(1) 电子管(5) 东方红(1) 接收机(2) 德生(17) 再生机(1) 车机(1) PL-365(1)
You might like
一个PHP的QRcode类与大家分享
2011/11/13 PHP
Yii框架form表单用法实例
2014/12/04 PHP
php简单实现屏蔽指定ip段用户的访问
2015/04/29 PHP
PHP常用技巧汇总
2016/03/04 PHP
详解PHP实现支付宝小程序用户授权的工具类
2018/12/25 PHP
Laravel timestamps 设置为unix时间戳的方法
2019/10/11 PHP
Laravel 简单实现Ajax滚动加载示例
2019/10/22 PHP
jQuery UI Autocomplete 体验分享
2012/02/14 Javascript
浅谈关于JavaScript的语言特性分析
2013/04/11 Javascript
实例代码详解jquery.slides.js
2015/11/16 Javascript
jQuery EasyUI 为Combo,Combobox添加清除值功能的实例
2017/04/13 jQuery
JavaScript实现求最大公共子串的方法
2018/02/03 Javascript
vue实现密码显示隐藏切换功能
2018/02/23 Javascript
layer.prompt输入层的例子
2019/09/24 Javascript
Vue解析带html标签的字符串为dom的实例
2019/11/13 Javascript
[59:36]2018DOTA2亚洲邀请赛 4.3 突围赛 Secret vs VG 第二场
2018/04/04 DOTA
go和python调用其它程序并得到程序输出
2014/02/10 Python
Python中尝试多线程编程的一个简明例子
2015/04/07 Python
解决Python出现_warn_unsafe_extraction问题的方法
2016/03/24 Python
利用python批量检查网站的可用性
2016/09/09 Python
python爬虫实战之爬取京东商城实例教程
2017/04/24 Python
13个最常用的Python深度学习库介绍
2017/10/28 Python
python实现五子棋人机对战游戏
2020/03/25 Python
Python Django 前后端分离 API的方法
2019/08/28 Python
解决pycharm最左侧Tool Buttons显示不全的问题
2019/12/17 Python
scrapy框架携带cookie访问淘宝购物车功能的实现代码
2020/07/07 Python
python 爬虫如何实现百度翻译
2020/11/16 Python
利用css3实现的简单的鼠标悬停按钮
2014/11/04 HTML / CSS
香港时尚女装购物网站：ZAFUL
2017/07/19 全球购物
2014年银行信贷员工作总结
2014/12/08 职场文书
个人承诺书格式范文
2015/04/29 职场文书
二胎满月酒致辞
2015/07/29 职场文书
机关干部作风整顿心得体会
2016/01/22 职场文书
如何用JavaScript检测当前浏览器是无头浏览器
2021/04/27 Javascript
Python中文纠错的简单实现
2021/07/07 Python
十大最强格斗系宝可梦,超梦X仅排第十，第二最重格斗礼仪
2022/03/18 日漫