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

WindySky 2007-01-20

展开全文

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

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

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

<html>

<head>

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

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>

<tr>

<th width="*">主题 (点 <img src="plus.gif"> 即可展开贴子列表)</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 align="left" class="tablebody2" nowrap> <span style="width:110px;">2005-9-15 13:34:43</span> <font color="#FF0000">|</font> Dicky</td>

</tr>

<tr>

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

<td class="tablebody2" align="center">dafsafsd</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>

</head>

<body>

//控制列表显示的代码

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>

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>

</head>

<body>

//控制列表关闭的代码

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