树型结构看着挺好的,用着也方便,不知道怎么实现啊。请大家帮帮忙,最好给点简单的代码!谢谢先!
http://fason.nease.net/ 里面找
http://fason.nease.net/zhuanti/tree/dtree/dtree.htm
<Script Language="JavaScript">
//Name﹕無限層樹狀
//Design:LiuZXIT
//OverTime:2003/3/19
//Note:在IE5.i上測試通過
var strStyle=<style type="text/css">
strStyle+=span.SelectIng{color:#ff00ff;border:solid 1pt #666666;padding:0.5pt;height:4px;background-color:#cccccc;}
strStyle+=span.NoSelect{color:#000084;border:solid 1pt #ffffff;padding:0.5pt;height:4px;background-color:#ffffff;}
strStyle+=span.SelectEd{color:#D02090;border:solid 1pt #888888;padding:0.5pt;height:4px;background-color:#f3f3f3;}
strStyle+=</style>
document.write(strStyle)
var myRs=new Array(), selectItem;
function compare(a,b) {return parseInt(a[1]) - parseInt(b[1])}
function InsertItem(s){myRs[myRs.length++] = s.split(/,/);}
function ExCloAll(n){
var d=document.all(0), e=d.all.tags(div)
for (i=0;i<e.length;i++)e[i].style.display=(n==1?block:none)
e=d.all.tags(p)
for (i=0;i<e.length;i++){if(ChkExist(e[i].children[1].value))e[i].children[0].innerText=(n==1?- :+ )}
}
function ExCloItem(){
var c,e=event.srcElement, p=e.parentElement.children
if(e.myHref!=){
alert((e.myTarget!=?e.myTarget:window)+.location=+e.myHref) //要改成連接到某頁只需把alert改成eval即可
//如果你不想觸發展合動作只需在這里加return;
}
else{window.status=no href};
if(selectItem!=null)selectItem.className=NoSelect;
e.className=SelectEd
selectItem=event.srcElement;
if(c=document.all(e.value)){
p[0].innerText=(p[0].innerText==+ ?- :+ )
c.style.display=(c.style.display==none?block:none)
}else{p[0].innerText=- }
}
function ExCloItem2(){
var c,e=event.srcElement, p=e.parentElement.children
if(c=document.all(p[1].value)){
e.innerText=(e.innerText==+ ?- :+ )
c.style.display=(c.style.display==block?none:block)
}else e.innerText=-
}
function OutItem(){
var e=event.srcElement
if(selectItem != )e.className=(selectItem==e?SelectEd:NoSelect)
else e.className=NoSelect
}
function ChkExist(n){
n=parseInt(n)
if((n<myRs[0][1])||(n>myRs[myRs.length-1][1]))return false
var a,b,c,x=0, y=parseInt(myRs.length/2), z=myRs.length-1
while((x!=y)&&(y!=z)){
a=myRs[x][1], b=myRs[y][1], c=myRs[z][1]
if(n==a||n==b||n==c)return true
if(n>b)x=y;
else z=y;y=parseInt(x+z);
y=parseInt((x+z)/2);
}
return false
}
function drawTree(n){
if(n==0){
myRs.sort(compare)
document.write(<p style="font:10pt;cursor:hand;"><span onclick="ExCloAll(1)">全部展開</span> <span onclick="ExCloAll(0)">全部合攏</span></p>)
}
if (ChkExist(n)!=true)return
document.write(<div id="+n+" style="font:10pt;cursor:hand;+(n!=0?position:relative;left:20;display:none;:)+">)
for(var i=0;i<myRs.length;i++){
if (parseInt(myRs[i][1])>n)break;
if (myRs[i][1]==n){
document.write(<p style="margin:0pt;"><span style="vertical-align:top;" onclick="ExCloItem2()">+(ChkExist(myRs[i][0])?+ :- )+</span>)
document.write(<span onclick="ExCloItem()" myHref="+(myRs[i].length>3?myRs[i][3]:)+" myTarget=" + (myRs[i].length>4?myRs[i][4]:) +" value="+myRs[i][0]+" class="NoSelect" onmouseout="OutItem()" onmouseover="this.className=\SelectIng\">+myRs[i][2]+</span></p>)
if (myRs[i].length >3)document.write(</a>);
drawTree(myRs[i][0])
}
}
document.write(</div>)
}
InsertItem(1,0,根目錄1)
InsertItem(11,1,子目錄1)
InsertItem(111,11,孫目錄1,b.htm,parent.frmMain)
InsertItem(1111,111,曾孫目錄,c.htm,top)
InsertItem(11111,1111,玄孫目錄,d.htm,window)
InsertItem(12,1,子目錄2)
InsertItem(2,0,根目錄2)
InsertItem(21,2,子目錄A,d.htm)
InsertItem(22,2,子目錄B)
InsertItem(3,0,根目錄3)
drawTree(0)
</Script>