动网论坛帖子跟帖展开/关闭测试-CSDN博客

看到动网论坛帖子列表里在用，就把它挖出来，核心是用浮动框架iframe来显示或隐藏跟帖列表。
共有3个文件和4个图片
在线演示：http://music.lzr.com.cn/apple/test/
打包下载：http://music.lzr.com.cn/apple/file/ExpandCollapse.rar
主页面：Index.htm如下：

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html >

< head >

< title > 论坛帖子跟帖展开/关闭测试 </ title >

< meta name ="Generator" content ="EditPlus" />

< meta name ="Author" content ="" />

< meta name ="Keywords" content ="" />

< meta name ="Description" content ="" />

< style type ="text/css" >

A:link,A:active,A:visited{

}{TEXT-DECORATION:none ;Color:#000000}

A:hover{

}{TEXT-DECORATION: underline;Color:#4455aa}

BODY{

}{

FONT-SIZE: 12px;

COLOR: #000000;

FONT-FAMILY: 宋体;

background-color: #FFFFFF;

scrollbar-face-color: #dbeedd;

scrollbar-highlight-color: #FFFFFF;

scrollbar-shadow-color: darkseagreen;

scrollbar-3dlight-color: #dbeedd;

scrollbar-arrow-color: darkseagreen;

scrollbar-track-color: #f3faf4;

scrollbar-darkshadow-color: #f3faf4;

background-image: url(lvbgcolor.gif);

text-align: center; margin: 0;

}

font{

}{line-height : normal ;}

TD{

}{

font-family: 宋体;

font-size: 12px;

line-height: 15px;

}

{

}{

background-color: #a9d46d;

background-image: url(h3.gif);

COLOR: #FFFFFF;

font-size: 12px;

font-weight:bold;

height:25;

}

td.tablebody1{

}{background-color: #f4faed;}

td.tablebody2{

}{background-color: #e3f1d1;}

.tableborder1{

}{width:88%;border: 1px; background-color: #a9d46d;}

</ style >

</ head >

< body >

< b > 动网论坛帖子跟帖展开/关闭测试 </ b >

< iframe width ="0" height ="0" src ="" name ="hiddenframe" ></ iframe >

< table cellPadding ="1" cellSpacing ="1" class ="tableborder1" align ="center" >

< form action ="" method ="post" name ="batch" >

< tr >

< th width ="*" > 主题 (点 < img src ="plus.gif" > 即可展开贴子列表) </ th >

< th width ="80" > 作者 </ th >

< th width ="40" > 回复 </ th >

< th width ="40" > 人气 </ th >

< th width ="195" > 最后更新 </ th >

</ tr >

< tr >

< td align ="left" class ="tablebody1" >< span style ="float:right" ></ span >< span id ="followImg356" >< a href ="Open.htm" target ="hiddenframe" title ="展开帖子列表" >< img src ="plus.gif" border ="0" align ="absmiddle" ></ a ></ span >   < a href ="#" title ="《帮帮忙？刚学ASP就遇到好多问题哦！》

作者：ASP学习者

发表于：2005-9-14 15:57:00

最后发贴：把你的完整代码

" > 帮帮忙？刚学ASP就遇到好多问题哦！ </ a ></ td >

< td class ="tablebody2" align ="center" > ASP学习者 </ td >

< td class ="tablebody1" align ="center" > 3 </ td >

< td class ="tablebody1" align ="center" > 9 </ td >

< td align ="left" class ="tablebody2" nowrap >   < span style ="width:110px;" > 2005-9-15 13:34:43 </ span >   < font color ="#FF0000" > | </ font >   Dicky </ td >

</ tr >

< tr id ="follow356" style ="display:none;" >< td id ="followTd356" class ="tablebody1" colspan ="7" ></ td ></ tr >

< tr >

< td align ="left" class ="tablebody1" > adffasd </ td >

< td class ="tablebody2" align ="center" > dafsafsd </ td >

< td class ="tablebody1" align ="center" > 2 </ td >

< td class ="tablebody1" align ="center" > 11 </ td >

< td align ="left" class ="tablebody2" nowrap >   < span style ="width:110px;" > 2005-1-15 13:34:43 </ span >   < font color ="#FF0000" > | </ font >   Dicky </ td >

</ tr >

</ form ></ table >

</ body >

</ html >

跟帖打开调用的页面Open.htm，代码如下：

< html >

< head >

< meta http-equiv ="Content-Type" content ="text/html; charset=gb2312" >

</ head >

< body >

< script language ="javascript" >

//控制列表显示的代码

var parentfollow=parent.document.getElementById("follow356")

var parentfollowTd=parent.document.getElementById("followTd356")

var parentfollowImg=parent.document.getElementById("followImg356")

if(parentfollow)

{

parentfollow.style.display="";

}

parentfollowTd.style.display="";

parentfollowImg.innerHTML='<a href="Close.htm" target="hiddenframe" title="关闭帖子列表" ><img src="nofollow.gif" border="0" ></a>';

parentfollowTd.innerHTML='<div style="width:240px;margin-left:18px;border:1px solid black;background-color:lightyellow;color:black;padding:2px">正在读取关于本主题的跟贴，请稍侯……</div>'

//分页代码,参数：页码,记录总数，每页显示数,页数

function showpage(page,RecordCount,PageSize,PageCount)

{

var Tmpstr='<div align=left style="width:100%;height:20;">　页次：'+page+' / '+PageCount+'页每页最多'+PageSize+'个共 '+RecordCount+' 个分页：'

if (page=='1')

{

Tmpstr+='<font face=webdings color="#FF0000">9</font>';

}else

{

Tmpstr+='<a href="loadtree1.asp?boardid=13&rootid=356&action=1&star=1" title="第一页" target="hiddenframe"><font face=webdings>9</font></a>';

}

var p;

if ((page-1)%10==0)

{

p=(page-1) /10

}

else

{

p=(((page-1)-(page-1)%10)/10)

}

if (p*10 > 0)

{

Tmpstr+='<a href="loadtree1.asp?boardid=13&rootid=356&action=1&star='+p*10+'" title="上十页" target="hiddenframe" ><font face=webdings>7</font></a> ';

}

Tmpstr+='<b>';

for (var i=p*10+1;i<p*10+11;i++)

{

if (i==page)

{

Tmpstr+=' <font color="#FF0000">'+i+'</font> ';

}

else

{

Tmpstr+=' <a href="loadtree1.asp?boardid=13&rootid=356&action=1&star='+i+'" target="hiddenframe">'+i+'</a> ';

}

if (i==PageCount) break;

}

Tmpstr+='</b>';

if (i<PageCount)

{

Tmpstr+='<a href="loadtree1.asp?boardid=13&rootid=356&action=1&star='+i+'" title="下十页" target="hiddenframe"><font face=webdings>8</font></a> ';

}

if (page==PageCount)

{

Tmpstr+='<Font face=webdings color="#FF0000">:</font>';

}

else

{

Tmpstr+='<a href="loadtree1.asp?boardid=13&rootid=356&action=1&star='+PageCount+'" title="最尾页" target="hiddenframe"><font face=webdings>:</font></a> ';

}

Tmpstr+='</div>';

return(Tmpstr)

}

</ script >

< Script Language =JavaScript >

var tmpstr='';tmpstr='<div align=left style="width:100%;height:20">　<img src="nofollow.gif"><a href="#" title="">把你的完整代码贴出来吧？第8行是指哪

</a> -- <a href="#">Dicky</a></div><div align=left style="width:100%;height:20">　<img src="nofollow.gif"><a href="#" title="">http://www.webjx.com/htmldata/2005-

</a> -- <a href="#">ASP学习者</a></div><div align=left style="width:100%;height:20">　<img src="nofollow.gif"><a href="#" title="">下次把具体错误和相关代码贴出来啊~~</a> -- <a href="#">Dicky</a></div>';

tmpstr+=showpage(1,3,10,1);

parent.document.getElementById("followTd356").innerHTML=tmpstr;

</ Script >

</ body >

</ html >

跟帖关闭调用页面Close.htm代码如下：

< html >

< head >

< meta http-equiv ="Content-Type" content ="text/html; charset=gb2312" >

</ head >

< body >

< script language ="javascript" >