客户端静态页面玩分页

眼睛哈哈88

眼睛哈哈88

2016-02-19 12:54

下面图老师小编要向大家介绍下客户端静态页面玩分页,看起来复杂实则是简单的,掌握好技巧就OK,喜欢就赶紧收藏起来吧!

!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女老师竭力向孩子们证明,学习好功课的重要性。 /pp她说:“牛顿坐在树下,眼睛盯着树在思考,这时,有一个苹果落在他的头上,于是他发现了万有引力定律,孩子们,你们想想看,做一位伟大的科学家多么好,多么神气啊,要想做到这一点,就必须好好学习。” /pp“班上一个调皮鬼对此并不满意。他说:“兴许是这样,可是,假如他坐在学校里,埋头书本,那他就什么也发现不了啦。” /pp女老师竭力向孩子们证明,学习好功课的重要性。 /pp她说:“牛顿坐在树下,眼睛盯着树在思考,这时,有一个苹果落在他的头上,于是他发现了万有引力定律,孩子们,你们想想看,做一位伟大的科学家多么好,多么神气啊,要想做到这一点,就必须好好学习。” /pp“班上一个调皮鬼对此并不满意。他说:“兴许是这样,可是,假如他坐在学校里,埋头书本,那他就什么也发现不了啦。” /pp女老师竭力向孩子们证明,学习好功课的重要性。 /pp她说:“牛顿坐在树下,眼睛盯着树在思考,这时,有一个苹果落在他的头上,于是他发现了万有引力定律,孩子们,你们想想看,做一位伟大的科学家多么好,多么神气啊,要想做到这一点,就必须好好学习。” /pp“班上一个调皮鬼对此并不满意。他说:“兴许是这样,可是,假如他坐在学校里,埋头书本,那他就什么也发现不了啦。” /pp女老师竭力向孩子们证明,学习好功课的重要性。 /pp她说:“牛顿坐在树下,眼睛盯着树在思考,这时,有一个苹果落在他的头上,于是他发现了万有引力定律,孩子们,你们想想看,做一位伟大的科学家多么好,多么神气啊,要想做到这一点,就必须好好学习。” /pp“班上一个调皮鬼对此并不满意。他说:“兴许是这样,可是,假如他坐在学校里,埋头书本,那他就什么也发现不了啦。” /pp女老师竭力向孩子们证明,学习好功课的重要性。 /pp她说:“牛顿坐在树下,眼睛盯着树在思考,这时,有一个苹果落在他的头上,于是他发现了万有引力定律,孩子们,你们想想看,做一位伟大的科学家多么好,多么神气啊,要想做到这一点,就必须好好学习。” /pp“班上一个调皮鬼对此并不满意。他说:“兴许是这样,可是,假如他坐在学校里,埋头书本,那他就什么也发现不了啦。” /p";
function DHTMLpagenation(content) { with (this)
{
 // client static html file pagenation

 this.content=content;
 this.contentLength=content.length;
 this.pageSizeCount;
 this.perpageLength=100; //default perpage byte length.
 this.currentPage=1;
 //this.regularExp=/.+[?&]{1}page=(d+)/;
 this.regularExp=/d+/;

 this.divDisplayContent;
 this.contentStyle=null;
 this.strDisplayContent="";
 this.divDisplayPagenation;
 this.strDisplayPagenation="";

 arguments.length==2?perpageLength=arguments[1]:'';

 try {
  divExecuteTime=document.createElement("DIV");
  document.body.appendChild(divExecuteTime);
 }
 catch(e)
 {
 }
 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;
  }
 }

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

 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;
  }
 }

 DHTMLpagenation.initialize();
 return this;

}};
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("请输入数字");
 }
}};

// method
// DHTMLpagenation(strContent,perpageLength)

DHTMLpagenation(s,100);

(本文来源于图老师网站,更多请访问http://m.tulaoshi.com/webkaifa/)

//--
/SCRIPT
/BODY
/HTML

展开更多 50%)
分享

猜你喜欢

客户端静态页面玩分页

Web开发
客户端静态页面玩分页

基于客户端的分页导航(1)

电脑网络
基于客户端的分页导航(1)

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

基于客户端的分页导航(2)

电脑网络
基于客户端的分页导航(2)

基于客户端的分页导航(3)

电脑网络
基于客户端的分页导航(3)

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

Zune 客户端

平面设计 标志设计 UI设计 VI设计
Zune 客户端

用Web页面执行客户端程序

ASP
用Web页面执行客户端程序

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

VB的API编程精粹(二)

VB的API编程精粹(二)

将HTML自动转为JS代码

将HTML自动转为JS代码
下拉加载更多内容 ↓