如何利用Dreamweaver实现静态网页的分页

我在利用Draemweaver制作网页，但是有时候文章太长，撑的网页上下很难看，请高手指教，如果实现自动分页
你这个怎么应用，我刚刚学，有点看不明白

举报该问题

推荐答案 2010-06-16

function pageHtml(total,pageSize,pageNow,url){

//total 总记录数

//pageSize 每页显示数

//pageNow 当前请求页

//url 分页网址页码使用$pageNow 如 list.aspx?p=$pageNow&s=baidu

var pageCode,pageCount;

if(total==0){

pageCode="没有任何数据";

}

else{

pageCount=total/pageSize==parseInt(total/pageSize)?total/pageSize:parseInt(total/pageSize)+1;

pageCode="<table cellspacing=\"0\" style=\"margin:0 auto;\" align=\"center\"><tr><td><div class='pagebox' id='_function_code_page'>{$pageCode}</div></td></tr></table>";

if(pageCount==1){

pageCode=pageCode.replace("{$pageCode}","共找到 "+total+" 条相关记录");

}

else{

pageNow=pageCount<pageNow?pageCount:pageNow;

pageNow=pageNow<1?1:pageNow;

var ps,po,i;

ps=pageNow-4;

po=pageNow+5;

if(pageCount<=10 || ps<1){

ps=1;

po=10;

}

if(po>pageCount){

ps=ps-po+pageCount>=1?ps-po+pageCount:1;

po=pageCount;

}

var _pageCode="<span class='pagebox_num'><a>"+total+"</a></span>";

if(ps>1){

_pageCode+= "<span class='pagebox_pre'><a href='"+url.replace("$pagenow","1")+"'>首页</a></span>";

}

_pageCode+= pageNow==1?"<span class='pagebox_pre_nolink'>上一页</span>":"<span class='pagebox_pre'><a href='"+url.replace("$pagenow",pageNow-1)+"'>上一页</a></span>";

for(i=ps;i<=po;i++){

_pageCode+= i==pageNow?"<span class='pagebox_num_nonce'>"+i+"</span>":"<span class='pagebox_num'><a href='"+url.replace("$pagenow",i)+"'>"+i+"</a></span>";

}

_pageCode+= pageNow==pageCount?"<span class='pagebox_next_nolink'>下一页</span>":"<span class='pagebox_next'><a href='"+url.replace("$pagenow",pageNow+1)+"'>下一页</a></span>";

if(po<pageCount){

_pageCode+= "<span class='pagebox_pre'><a href='"+url.replace("$pagenow",pageCount)+"'>尾页</a></span>";

}

pageCode=pageCode.replace("{$pageCode}",_pageCode);

}

}

return pageCode;

}

css 部份:

.pagebox{zoom:1;}

.pagebox span{float:left; margin-right:2px; overflow:hidden; text-align:center; background:#fff;}

.pagebox span a{display:block; zoom:1; overflow:hidden; _float:left;}

.pagebox span.pagebox_pre_nolink{border:1px #ddd solid; width:53px; height:21px; *height:21px; line-height:21px; text-align:center; color:#999; cursor:default;}

.pagebox span.pagebox_pre{color:#3568b9; height:23px;}

.pagebox span.pagebox_pre a,.pagebox span.pagebox_pre a:visited,.pagebox span.pagebox_next a,.pagebox span.pagebox_next a:visited{border:1px #9aafe5 solid; color:#3568b9; text-decoration:none; text-align:center; width:53px; cursor:pointer; height:21px; line-height:21px;}

.pagebox span.pagebox_pre a:hover,.pagebox span.pagebox_pre a:active,.pagebox span.pagebox_next a:hover,.pagebox span.pagebox_next a:active{color:#363636; border:1px #2e6ab1 solid;}

.pagebox span.pagebox_num_nonce{padding:0 8px; height:23px; line-height:23px; _height:21px; _line-height:21px; color:#fff; cursor:default; background:#296cb3; font-weight:bold;}

.pagebox span.pagebox_num{color:#3568b9; height:23px;}

.pagebox span.pagebox_num a,.pagebox span.pagebox_num a:visited{border:1px #9aafe5 solid; color:#3568b9; text-decoration:none; padding:0 8px; cursor:pointer; height:21px; *height:21px; line-height:21px;}

.pagebox span.pagebox_num a:hover,.pagebox span.pagebox_num a:active{border:1px #2e6ab1 solid;color:#363636;}

.pagebox span.pagebox_num_ellipsis{color:#393733; width:22px; background:none; line-height:23px;}

.pagebox span.pagebox_next_nolink{border:1px #ddd solid; width:53px; height:21px; *height:21px; line-height:21px; text-align:center; color:#999; cursor:default;}

.pagebox select{margin:0 0 0 5px;border:1px solid #296cb3;height:22px;width:60px;background:#ffc;}

调用方法 document.write(pageHtml(1000(总记录数),20(每页显示数),23(当前第几页),'list.aspx?p=$pageNow&其它条件'));

二

//每页显示字数
PageSize=5000;
//分页模式
flag=2;//1:根据字数自动分页 2:根据[NextPage]分页
//默认页
startpage = 1;
//导航显示样式 0:常规 1:直接 3:下拉
TopShowStyle = 1;
DownShowStyle = 0;

var currentSet,CutFlag,TotalByte,PageCount,key,tempText,tempPage;
key="";
currentSet=0;
var Text=xmlArticle.selectSingleNode("//Content").text;
TotalByte=Text.length;

if (flag==1)
{
PageCount=Math.round(TotalByte/PageSize);
if(parseFloat("0."+TotalByte%PageSize)>0){
if(parseFloat("0."+TotalByte%PageSize)<0.5){
PageCount=PageCount+1;
}
}
var PageNum=new Array(PageCount+1);
var PageTitle=new Array(PageCount+1);
PageNum[0]=0;
PageTitle[0]="";

var sDrv1,sDrv2,sDrv3,sDrv4,sFlag;
var sDrvL,sTemL;
var sTem1,sTem2,k;
sFlag=0;

for(j=1;j<PageCount+1;j++){
PageNum[j]=PageNum[j-1]+PageSize;
PageTitle[j]="";
//alert(j);
sDrv1="<br>";
sDrv2="<BR>";
sDrv3="<Br>";
sDrv4="<bR>";
sDrvL=sDrv1.length;
for(k=PageNum[j];k<=TotalByte;k++){
sTem1=Text.substring(PageNum[j]-sDrvL,k);
sTemL=sTem1.length;
sTem2=sTem1.substring(sTemL-sDrvL,sTemL)
if (sTem2==sDrv1 || sTem2==sDrv2 || sTem2==sDrv3 || sTem2==sDrv4)
{
sFlag=sFlag+1;
PageNum[j]=k;
break;
}
}
if (PageNum[j]>TotalByte)
{
break;
}
}
if (j<PageCount)
{
PageNum.length=j;
PageCount=j
}
if (PageCount>1&&sFlag>1&&PageCount<sFlag)
{
PageCount=sFlag+1;
}
}
else{
//手动分页
var j,sFlag,PageCount,sText;
var sTitleFlag;
var PageNum=new Array();
var PageTitle=new Array();

PageSize=0;
j=1;
PageNum[0]=-10;
PageTitle[0]="";
sFlag=0;
sText=Text;

do
{
sText=Text.substring(PageNum[j-1]+10,TotalByte);

sFlag=sText.indexOf("[NextPage");

if (sText.substring(sFlag+9,sFlag+10)=="=")
{
sTitleFlag=sText.indexOf("]",sFlag);
PageTitle[j]=sText.substring(sFlag+10,sTitleFlag);
}
else{
PageTitle[j]="";
}

if (sFlag>0)
{
PageNum[j]=sFlag+PageNum[j-1]+10;
}
else{
PageNum[j]=TotalByte;
}

j+=1;
}
while (PageNum[j-1]<TotalByte);

PageCount=j-1;
}

function text_pagination(Page){
var Output,Byte;

if(Page==null){Page=1;}

Output="";
Output=Output+"<table width=100% height=30 border=0 align=center cellpadding=0 cellspacing=0>";
Output=Output+"<tr>";
Output=Output+"<td height=1 background=Images/DotLine.gif></td>";
Output=Output+"</tr>";

//头部功能导航条
Output=Output+"<tr>";

//正文查找

Output=Output+"<td align=left bgcolor=#f0faff width='40%'> ";
Output=Output+"<input type=text name=keys onchange='key=this.value' size=12> <input type=button name=search value='查找正文' onclick='searchkey();' style='width:60'>";
Output=Output+"</td>";

Output=Output+"<td align=right bgcolor=#f0faff>";

//页码显示方式一
//第x页：分页标题
if (Page==0 || PageCount==0){
Output=Output+"当前是：<font color=red>全文显示</font>" ;
}
else{
if(TotalByte>PageSize){Byte=PageNum[Page]-PageNum[Page-1]}else{Byte=TotalByte};
Output=Output+"第 <font color=red>"+Page+"</font> 页";
if (PageTitle[Page]!="")
{
Output=Output+"：<font color=800000>"+PageTitle[Page]+"</font>";
}
Output+=' ';
}

//显示方式二
//下拉菜单选择
//if (PageCount>0)
//{
// Output=Output+Article_PageNav(2,Page);
// Output=Output+" </td>";
//}

//显示方式三
//页码选择列表
//Output=Output+"<td align=right bgcolor=#f0faff>";
//Output=Output+Article_PageNav(0,Page);
//Output=Output+"</td>";

Output=Output+"</tr>";
Output=Output+"<tr>";
Output=Output+"<td height=1 background=Images/DotLine.gif></td>";
Output=Output+"</tr>";
Output=Output+"</table>";

//显示正文
if(Page==0) {
//不分页
tempText=Text;
}
else{
//分页
if (flag==1)
//自动分页
{
tempText=Text.substring(PageNum[Page-1],PageNum[Page]);
}
else{
//手动分页
if (PageTitle[Page-1].length==0)
{
tempText=Text.substring(PageNum[Page-1]+10,PageNum[Page]);
}
else{
tempText=Text.substring(PageNum[Page-1]+11+PageTitle[Page-1].length,PageNum[Page]);
}
}
}

//布置内容
Output=Output+"<div align=center>";
Output=Output+Article_PageNav(TopShowStyle,Page);
Output=Output+"</div>";

Output=Output+"<div id=world>";
Output=Output+tempText;
Output=Output+"</div>";
Output=Output+"<br>";

Output=Output+"<div align=center>";
Output=Output+Article_PageNav(DownShowStyle,Page);
Output=Output+"</div>";

article.innerHTML = Output;
if (Page>1)
{
document.location.href='#top';
}

eval(document.all.keys).value=key;
if (key!=""){searchkey();}
}

function searchkey(){
//正文查找函数

h="<font class=keyworld>";
f="</font>";
keyset=new Array();
key=document.all.keys.value;
if (key==""){
alert("请输入关键字！");
return;
}
else{
keyset[0]=tempText.indexOf(key,0);
if (keyset[0]<0){
return;
}else
temp=tempText.substring(0,keyset[0]);
temp=temp+h+key+f;
temp2=tempText.substring(keyset[0]+key.length,tempText.length);
for (i=1;i<tempText.length;i++) {
keyset[i]=tempText.indexOf(key,keyset[i-1]+key.length);
if(keyset[i]<0){
temp=temp+tempText.substring(keyset[i-1]+key.length,tempText.length);
break;
}else{
temp=temp+tempText.substring(keyset[i-1]+key.length,keyset[i])+h+key+f;
}
}
world.innerHTML = temp;
}
}

function Article_PageNav(ShowStyle,Page){
//分页码显示函数
//参数为调用样式，0=简单样式，1=标准样式
var temp="";

if (ShowStyle==0)
//简单样式
{
tempPage=Page;
if(TotalByte>PageSize){
if (Page-4<=1){
temp=temp+"<font face=webdings color=#999999>9</font>";
if (Page<=1){temp=temp+"<font face=webdings color=#999999>7</font>";}else{temp=temp+"<a href=javascript:text_pagination("+(Page-1)+")><font face=webdings>7</font></a>";}
if (PageCount>10){
for(i=1;i<8;i++){
if (i==Page){
temp=temp+"<font color=red>"+i+"</font> ";
}else{
temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";
}
}
temp=temp+" ...";
}
else{
for(i=1;i<PageCount+1;i++){
if (i==Page){
temp=temp+"<font color=red>"+i+"</font> ";
}
else{
temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";
}
}
}

if (Page==PageCount){temp=temp+"<font face=webdings color=#999999>8</font>";}else{temp=temp+"<a href=javascript:text_pagination("+(Page+1)+")><font face=webdings>8</font></a>";}
if(PageCount<10){temp=temp+"<font face=webdings color=#999999>:</font>";}else{temp=temp+"<a href=javascript:text_pagination("+PageCount+")><font face=webdings>:</font></a>";}
}
else if(Page+4<=PageCount){
temp=temp+"<a href=javascript:text_pagination(1)><font face=webdings>9</font></a>";
temp=temp+"<a href=javascript:text_pagination("+(Page-1)+")><font face=webdings>7</font></a>";
if (PageCount>10){
temp=temp+"..";
for(i=Page-4;i<Page+4;i++){
if (i==Page){
temp=temp+"<font color=red>"+i+"</font> ";
}
else{
temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";
}
}
temp=temp+" ..";
}
else{
for(i=1;i<PageCount+1;i++){
if (i==Page){
temp=temp+"<font color=red>"+i+"</font> ";
}
else{
temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";
}
}
}

if (Page==PageCount){temp=temp+"<font face=webdings color=#999999>8</font>";}else{temp=temp+"<a href=javascript:text_pagination("+(Page+1)+")><font face=webdings>8</font></a>";}
temp=temp+"<a href=javascript:text_pagination("+PageCount+")><font face=webdings>:</font></a>";

}
else{
temp=temp+"<a href=javascript:text_pagination(1)><font face=webdings>9</font></a>";
temp=temp+"<a href=javascript:text_pagination("+(Page-1)+")><font face=webdings>7</font></a>";
temp=temp+".."

for(i=Page-2;i<PageCount+1;i++){
if (i==Page){
temp=temp+"<font color=red>"+i+"</font> ";
}
else{
temp=temp+"<a href=javascript:text_pagination("+i+") >"+i+"</a>"+" ";
}
}

if (Page==PageCount){temp=temp+"<font face=webdings color=#999999>8</font>";}else{temp=temp+"<a href=javascript:text_pagination("+(Page+1)+")><font face=webdings>8</font></a>";}
temp=temp+"<font face=webdings color=#999999>:</font>";
}
}
else{
temp=temp+"<font color=red>1</font> ";
}

temp=temp+" <a href=javascript:text_pagination(0)>显示全部</a>"
}
else if (ShowStyle==1)
//标准样式
{
if(TotalByte>PageSize){if(Page!=0){if(Page!=1){temp=temp+"<a href='#top' onclick=javascript:text_pagination("+(Page-1)+")><font color=3366cc>[上一页]</font></a>  ";}}}
for (i=1;i<PageCount+1 ;i++ )
{
if (Page==i)
{
temp=temp+"<font color=800000>["+i+"]</font>  ";
}
else{
temp=temp+"<a href='#top' onclick=javascript:text_pagination("+i+")><font color=3366cc>["+i+"]</font></a>  ";
}
}
temp=temp+"<a name='foot'></a>";
if(TotalByte>PageSize){if(Page!=0){if(Page!=PageCount){temp=temp+"<a href='#top' onclick=javascript:text_pagination("+(Page+1)+")><font color=3366cc>[下一页]</font></a>";}}}

temp=temp+" <a href=javascript:text_pagination(0)><font color=3366cc>显示全部</font></a>"
}
else if (ShowStyle==2)
//下拉菜单样式
{
temp=temp+'<select onchange="text_pagination(this.value)">'
for (i=1;i<PageCount+1 ;i++ )
{
if (Page==i)
{
temp=temp+"<option value='"+i+"' selected style='color:red'>第 "+i+" 页"

}
else{
temp=temp+"<option value='"+i+"'>第 "+i+" 页";
}
if (PageTitle[i].length!=0)
{
temp=temp+'：'+PageTitle[i];
}
temp=temp+"</option>";
}
temp=temp+"</select>";
}

return (temp);
}

//默认页
text_pagination(startpage);

---------------------------------------------------------------------------------------分页js代码结束

－－－－－－－－－－－－－－－－－－－－－－－－－－－html页面，调用分页js

<HTML><HEAD><TITLE>js分页</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
</HEAD>
<BODY bottomMargin=0 leftMargin=0 topMargin=0 rightMargin=0>

<TABLE cellSpacing=1 cellPadding=5 width="95%" align=center
border=0>
<TBODY>
<TR>
<TD>

<xml id=xmlArticle>
<Article>
<Info>
<Content>
<![CDATA[
大家来试验分页哦~~~~~[NextPage]我分~~~[NextPage]我再分[NextPage]分分分
]]>
</Content>
</Info>
</Article>
</xml>


<SCRIPT language=Javascript
src="attachments/month_0607/j200674214834.js"></SCRIPT>

</TD></TD></TR></TBODY></TABLE></TD></TR>
</TBODY></TABLE>

温馨提示：答案为网友推荐，仅供参考

当前网址：http://00.wendadaohang.com/zd/DjIInZDDD.html

第1个回答 2015-12-25

大体有两种：
第一种：自己编写PHP语言，实现智能化转换。（需要一定编写基础）不推荐；
第二种：为自己做的HTML直接套一个二次开发后台，DEDE、帝国、PHPCMS等等一系列，把后台模板文件转换成自己的HTML，就可以实现全局静态化。
建议：
先从DEDE套起，比较容易点
必杀技：从网站模板网下载整个站点，随后模板换成自己的。需要会用二次开发，本回答被网友采纳

第2个回答 2015-12-08

可以用js 分也可以用

相似回答

大家正在搜

静态网页如何对长文章进行分页（Dreamweaver制作）

dreamweaver中对长文章如何分页？

怎样用dreamweaver制作网页，3-4页，并且能从主页...

关于怎样在dreamweaver中做分页

dreamweaver中分页

在dreamweaver中实现asp的分页显示

使用dreamweaver cs4 ，在同一个html文件内...

dreamweaver好几张图片如何进行分页显示