如何將這個靜態樹型菜單做成動態的????????

Jeroki 2002-07-03 08:50:50

我對動態樹型菜單是這樣定義的:
A(a1,a2,a3,a4……an)
B(b1,b2,………bn)
………
N(n1,n2,………nn)

我的A,B,…N(a1,a2……)全部來自數据庫!
<script language="JavaScript1.2">
scores = new Array(20);var numTotal=0;NS4 = (document.layers) ? 1 : 0;IE4 = (document.all) ? 1 : 0;ver4 = (NS4 || IE4) ? 1 : 0;if (ver4) { with (document) {
write("<STYLE TYPE='text/css'>"); if (NS4) {
write(".parent {position:absolute; visibility:visible}");
write(".child {position:absolute; visibility:visible}");
write(".regular {position:absolute; visibility:visible}") } else { write(".child {display:none}") }
write("</STYLE>"); }}

function getIndex(el) { ind = null; for (i=0; i<document.layers.length; i++) { whichEl = document.layers[i];
if (whichEl.id == el) { ind = i; break; } }
return ind;}function arrange() { nextY = document.layers[firstInd].pageY +document.layers[firstInd].document.height;
for (i=firstInd+1; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.visibility != "hide") { whichEl.pageY = nextY; nextY += whichEl.document.height; } }}

function initIt(){ if (!ver4) return; if (NS4) {
for (i=0; i<document.layers.length; i++) {
whichEl = document.layers[i];
if (whichEl.id.indexOf("Child") != -1) whichEl.visibility = "hide"; } arrange(); }
else { divColl = document.all.tags("DIV");
for (i=0; i<divColl.length; i++) {
whichEl = divColl(i);
if (whichEl.className == "child") whichEl.style.display = "none"; } }}

function expandIt(el) { if (!ver4) return;
if (IE4) { whichEl1 = eval(el + "Child");
for(i=1;i<=numTotal;i++){ whichEl = eval(scores[i] + "Child");
if(whichEl!=whichEl1) { whichEl.style.display = "none"; } } whichEl1 = eval(el + "Child");
if (whichEl1.style.display == "none") { whichEl1.style.display = "block"; }
else { whichEl1.style.display = "none"; } }
else { whichEl = eval("document." + el + "Child");
for(i=1;i<=numTotal;i++){ whichEl = eval("document." + scores[i] + "Child");
if(whichEl!=whichEl1) {
whichEl.visibility = "hide"; } }
if (whichEl.visibility == "hide") { whichEl.visibility = "show"; }
else {
whichEl.visibility = "hide"; } arrange(); }}onload = initIt;
</script>

</head>

<body bgcolor="#FFFFFF" text="#000000">

<div id='KB1Parent' class='parent'>
<a href="#" onClick="expandIt('KB1'); return false">
<IMG SRC='plus.gif' BORDER=0>kiss you!</a></div>
<div id='KB1Child' class='parent'>
<a href='time1.htm' target='_target'> <IMG SRC='blank.gif' BORDER=0>001</a><br>
<a href='time2.htm' target='_target'> <IMG SRC='blank.gif' BORDER=0>002</a><br>
<a href='time3.htm' target='_target'> <IMG SRC='blank.gif' BORDER=0>003</a><br>
<a href='time4.htm' target='_target'> <IMG SRC='blank.gif' BORDER=0>004</a><br>
<a href='time5.htm' target='_target'> <IMG SRC='blank.gif' BORDER=0>005</a><br>
<a href='time6.htm' target='_target'> <IMG SRC='blank.gif' BORDER=0>006</a><br>
<a href='time7.htm' target='_target'> <IMG SRC='blank.gif' BORDER=0>007</a><br>
<a href='time8.htm' target='_target'> <IMG SRC='blank.gif' BORDER=0>008</a></div>

<SCRIPT>numTotal=1;scores[1]='KB1';scores[2]='KB1';</SCRIPT>

...全文

79 3 打赏收藏转发到动态举报

写回复

用AI写文章

3 条回复

切换为时间正序

请发表友善的回复…

发表回复

zhenhao 2002-07-04

打赏
举报

//显示动态分级目录
function redrawtree()
{
var doc=top.treeframe.window.document;
//doc代表了显示动态分级目录的分页面
doc.clear();
doc.writeln("<head>");
doc.writeln("<stype>");
doc.writeln("");
doc.writeln("</style>");
doc.writeln("</head>");
doc.writeln("<body bgcolor='#ffffdd'>");
redrawnode(folderstree,doc,0,1,"");
doc.close();
}
function redrawnode(foldersnode,doc,level,lastnode,leftside)
//具体显示一个节点
{
var j=0;
var i=0;
doc.writeln("<table boder=0 cellspacing=0 celpadding=0>");
doc.writeln("<tr height=15><td valign=bottom alig=left nowrap>");
doc.writeln(leftside);
if(level>0)
if(lastnode)
{
doc.writeln("<img src='../law_rule/pic/line0.gif'
width=50 height=16>");
leftside=leftside+"<img src='../law_rule/pic/blank.gif'
width=50 height=16>";
}
else
{
doc.writeln("<img src='../law_rule/pic/line1.gif'
width=50 height=16>");
leftside=leftside+"<img src='../law_rule/pic/vertline.gif'
width=50 height=16 align=left>";
}
displayiconandlabel(foldersnode,doc);
doc.writeln("</table>");
if(foldersnode.length>4&&foldersnode[0])
//如果该节点是文件夹节点且已被打开
{
if(!foldersnode[2])
{
level=level+1;
for(i=4;i<foldersnode.length;i++)
if(i==foldersnode.length-1)
redrawnode(foldersnode[i],doc,level,1,leftside);
else
redrawnode(foldersnode[i],doc,level,0,leftside);
}
else
{
for(i=4;i<foldersnode.length;i++)
{

doc.writeln("<table border=0 cellspacing=0
cellpadding=0 valign=center>");
doc.writeln("<tr height=15><td valign=bottom
align=left nowrap>");
doc.write(leftside);
if(i==foldersnode.length-1)
doc.writeln("<img src='../law_rule/pic/line0.gif'
width=50 height=16>");
else
doc.writeln("<img src='../law_rule/pic/line1.gif'
width=50 height=16>");
doc.write(foldersnode[i]);
doc.write("</td></tr>");
doc.writeln("</table>");
}
}
}
}
function displayiconandlabel(foldersnode,doc)
{
if(foldersnode[0]<2)
{
doc.writeln("<a href='' onClick='top.openbranch(\""+foldersnode[3]
+"\"; return false;'target=_self><img src=");
if(foldersnode[1])
{
doc.writeln("../law_rule/pic/minus.gif
width=18 height=16 border=0></a>");
doc.writeln("<img src=../law_rule/pic/pad.gif
width=18 height=16 border=0>");
}
else
{
doc.writeln("../law_rule/pic/plus3.gif width=18
height=16 border=0></a>");
doc.writeln("<img src=../law_rule/pic/pad.gif width=18
height=16 border=0>");
}
doc.writeln("<td valign=bottom align=left nowrap>");
doc.writeln("<span class='p1'>"+foldersnode[3]+"</span>");
}
else
{
doc.writeln("<td valign=bottom align=left nowrap>");
doc.writeln(foldersnode);
}
}
//**********************************************
//事件处理函数
//当用户单击一个文件夹节点时调用这个函数
function openbranch(branchname)
{
clickonfolderrec(folderstree,branchname);
if(branchname=="法律法规"&&folderstree[0]==0)
{
top.folderframe.location="basefolder2.htm";
}
timeoutid=setTimeout("redrawtree()",100);
//一定时间后自动刷新页面,重画动态分级目录
}
//递归函数用来打开和关闭节点及其子节点
function clickonfolderrec(foldersnode,foldername)
{
var i=0;
if(foldersnode[3]==foldername)
{
if(foldersnode[0]) //如果该节点是打开的
closefolders(foldersnode);//将其关闭
else
{
foldersnode[0]=1;
foldersnode[1]=1; //打开该文件夹和文档
}
}
else
{
if(!foldersnode[2]) //如果该节点的孩子是文件夹节点
for(i=4;i<foldersnode.length;i++)
if(foldersnode[0]<1) //判断节点的类型,文档或文件夹
clickonfolderrec(foldersnode[i],foldername);
}
}
//递归函数用来关闭节点及其子节点
function closefolders(foldersnode)
{
var i=0;
if(!foldersnode[2])
{
for(i=4;i<foldersnode.length;i++)
if(foldersnode[0]<1) //判断节点的类型,文档或文件夹
closefolders(foldersnode[i]);
}
foldersnode[0]=0;
foldersnode[1]=0;
}

zhenhao 2002-07-04

打赏
举报

当将default.asp这个页面载入浏览器时，首先调用initializetree()函数来完成动态分级目录的创建和显示。这个函数进一步调用由ASP生成的generatetree()函数，该函数通过ADO从头到尾扫描law_type_name中的数据，并由此生成包含所有节点的数组，在数组已经存在的基础上调用Redrawtree()等函数就可以递归地在页面上显示分级目录了。
下面是对主要用到的一些函数的详细介绍：
generatetree()函数，利用ASP创建每个节点的数组，并建立起各节点之间的联系，程序代码如下：
<%
set myconn=server.createobject("adodb.connection")
//创建ADO的connection对象的实例myconn
set rs=server.createobject("adodb.recordset")
//创建ADO的recordset对象的实例rs
rs.open "select * from law_type_name order by
typekey",myconn,adopenstatic //将law_type_name中的数据赋给rs
cr=chr(13)&chr(10)//回车换行符
response.write("<script languang=Javascript>"&cr)
response.write("function generatetree(){"&cr)
response.write("var aux;"&cr)
response.write("aux=new Array();"&cr)
i=1
while not rs.eof //开始逐个扫描law_type_name中的数据
if rs("f_point")=0 then //生成最根本的节点，其他节点都是它的子孙
response.write("folderstree=foldernode('"
&trim(rs("typename"))&"');"&cr)
else
if rs("b_point")=0 then //若该节点为文件夹节点
if rs("f_point")=1 then //若该节点是根的直接子节点

response.write("aux["&rs("typekey")&"]=appendchild
(folderstree,foldernode('"&trim(rs("typename"))&"'));"&cr
//加入文件夹节点
else
response.write("aux["&rs("typekey")&"]=
appendchild(aux["&rs("f_point")&"],
foldernode('"&trim(rs("typename"))&"'));"&cr
//加入文件夹节点
end if
else
if rs("f_point")=1 then
response.write("appendchild(folderstree,generatedocentry(0,'"&
trim(rs("typename"))&"','',"&trim(rs("typekey"))&"));"&cr)
//加入文档节点
else
response.write("appendchild(aux["&rs("f_point")&"],
generatedocentry(0,'"&trim(rs("typename"))&"','',"
&trim(rs("typekey"))&"));"&cr) //加入文档节点
end if
end if
end if
rs.movenext
wend
response.write("}")
response.write("</script>")
rs.close //释放对象资源
myconn.close
%>
//******************************
//下面是构造节点的辅助函数
function foldernode(name) //用来生成文件夹节点
{
var arrayaux;
arrayaux=new Array();
arrayaux[0]=0;
arrayaux[1]=0;
arrayaux[2]=0;
arrayaux[3]=name;
return arrayaux;
}
function generatedocentry(icon,docdescription,link,num)
//用来生成文档节点
{
var retstring="";
retstring="<img src='../law_rule/pic/doc.gif'";
//用来显示文档节点前的小图标
retstring=retstring+"border=0>"+" "+"<td nowrap>"+
"<a href=typeinquest.asp?typekey="+num+
"target='folderframe'>"+docdescription+"</a>"+" ";
//显示带超链接的文档节点
return retstring;
}
function appendchild(parent,child)
//建立文件夹节点与文档节点之间的关系
{
parent[parent.length]=child;
return child;
}
//*************************************
//当网页载入浏览器时调用这个函数
function initializetree() //页面的初始化
{
generatetree();
top.openbranch("法律法规"); //显示根节点
redrawtree(); //显示整个动态分级目录
}
//**************************************

flashasp 2002-07-04