模拟静态分页的特效代码。
<!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>";
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;
}
}
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);
//-->
</script>
</body>
</html>
以上就是分享一个模拟静态网页分页的特效代码实例的详细内容。