X.T 發表
不限層數,類似檔案總館
<!-------------------------------------------------------------------------------
我不太會說明,請自行參考附註說明
-------------------------------------------------------------------------------->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=big5">
<meta http-equiv="Content-Language" content="zh-tw">
<title>Content</title>
<base target="frmMain">
<script language="JavaScript">
<!--
//Description/////////////////////////////////////////////////////////////////
//1. Branch: 具備下層選單結構者稱為分支 (亦即資料夾)
//2. Item: 樹狀結構的最下層,包含超連結者,稱為項目
//3. 分支計數用來統計選單並製作選單及節點圖片的 ID
//4. 項目計數用來統計超連結 (錨物件)
//Global Variable/////////////////////////////////////////////////////////////
var GstrTreeStructor=""; //樹狀結構輸出字串
var GintBranchCount=0; //分支計數
var GintItemCount=0; //項目計數
//images path
//圖片請自行準備
var GstrBookClose="../icon/book.Sky/book.close.gif";
var GstrBookOpen="../icon/book.Sky/book.open.gif";
var GstrPage="../icon/book.Sky/page.gif";
//Function Set////////////////////////////////////////////////////////////////
function objItem(n,k) {
//自訂超連結項目物件
this.name=n;
this.link=k;
}//end of objItem()
function menuExpend(id) {
//開啟或是收縮下層選單
top.focus();
var img=eval("document.all.img"+id);
var tab=eval("document.all.tab"+id);
if(tab.style.display=="none") {
tab.style.display="block";
img.src=GstrBookOpen; }
else {
tab.style.display="none";
img.src=GstrBookClose; }
}// end of menuExpend()
function treeBuild(obj,pos) {
//建構樹狀目錄,輸出 HTML 碼
if(pos=="end" && obj.constructor!=Array)
GstrTreeStructor+="<tr><td style='padding-top:5; padding-bottom:8;'>";
else
GstrTreeStructor+="<tr><td style='padding-top:5;'>";
if(obj.constructor==Array) {
//新的分支 (使用遞迴呼叫)
GintBranchCount++;
var tabID="tab"+GintBranchCount;
var imgID="img"+GintBranchCount;
GstrTreeStructor+=
"<a href='exp:" + imgID + "' target=_self" +
" onclick=\"javascript: menuExpend(" + GintBranchCount + "); return false;\">" +
"<img align=absMiddle border=0 id=" + imgID +
" src=" + GstrBookClose + " valign=middle>" +
"</a>" +
obj[0] +
"<table id=" + tabID + " border=0 cellpadding=0 cellspacing=0" +
" style=\"position:relative; left:18; display:none;\">" ;
for(var i=1; i<obj.length; i++)
if(i==(obj.length-1)) treeBuild(obj[i],"end");
else treeBuild(obj[i],"mid");
GstrTreeStructor+="</table>";
}
else {
//超連結項目
GintItemCount++;
GstrTreeStructor+=
"<img align=absMiddle border=0 src=" + GstrPage + ">" +
"<a id=lnk" + GintItemCount + " href=" + obj.link + ">" + obj.name + "</a>";
}
GstrTreeStructor+="</td></tr>";
}//end of treeBuild()
function treeCreate() {
//整個選單結構記錄在這裡
//使用多維陣列,輸入時注意陣列足標不要重複
//遇到一個新的分支,就會多出一個維度
//如果是一個資料夾(新的分支,包含下層選單),宣告成 new Array()
//如果是一個超連結項目(最底層),宣告成 new objItem()
var arTree=new Array();
//Root
var i=-1;
i++;
arTree[i]="My Papers";
i++;
arTree[i]=new Array();
arTree[i][0]="網站資訊";
arTree[i][1]=new objItem("網站導覽","../inform/guide.htm");
arTree[i][2]=new objItem("網站歷史","../inform/history.htm");
arTree[i][3]=new objItem("更新紀錄","../inform/update/update.htm");
arTree[i][4]=new objItem("About Me ..","../inform/me.htm");
i++;
arTree[i]=new Array();
arTree[i][0]="程式設計";
arTree[i][1]=new Array();
arTree[i][1][0]="IIS Development";
arTree[i][1][1]=new objItem("Server Variables","../program/iisdevelop/variables.htm");
arTree[i][1][2]=new objItem("SSI Directives","../program/iisdevelop/ssi/ssi.htm");
arTree[i][2]=new objItem("程式設計原則","../program/principle/020103.principle.htm");
arTree[i][3]=new objItem("Script 語言","../program/script.htm");
arTree[i][4]=new objItem("w3 JMail Reference","../program/w3jmail/w3jmail.htm");
i++;
arTree[i]=new Array();
arTree[i][0]="技術零件";
arTree[i][1]=new Array();
arTree[i][1][0]="DHTML";
arTree[i][1][1]=new objItem("HTML技巧","../part/dhtml/html.tec.htm");
arTree[i][1][2]=new objItem("取消右鍵功能","../part/dhtml/nocontent.htm");
arTree[i][1][3]=new objItem("沒有邊界的視窗","../part/dhtml/borderless.htm");
arTree[i][1][4]=new objItem("關閉廣告視窗","../part/dhtml/banner.cancel.htm");
arTree[i][1][5]=new objItem("取得物件屬性","../part/dhtml/obj.property.htm");
arTree[i][2]=new Array();
arTree[i][2][0]="ASP";
arTree[i][3]=new objItem("Ping 指令簡介","../part/ping.htm");
arTree[i][4]=new objItem("PGP 簡介","../part/pgp.htm");
i++;
arTree[i]=new Array();
arTree[i][0]="程式範例";
arTree[i][1]=new objItem("身份證驗證程式","../example/id.check.htm");
arTree[i][2]=new objItem("Indexing 搜尋引擎","../example/indexing.htm");
i++;
arTree[i]=new Array();
arTree[i][0]="伺服器";
arTree[i][1]=new Array();
arTree[i][1][0]="Windows";
arTree[i][1][1]=new objItem("事件檢視","../server/windows/event/event.htm");
arTree[i][2]=new Array();
arTree[i][2][0]="w3 JMailServer";
i++;
arTree[i]=new Array();
arTree[i][0]="附錄文件";
arTree[i][1]=new objItem("ASCII Code","../appendix/ascii.htm");
arTree[i][2]=new objItem("網路資源","../appendix/resource.htm");
arTree[i][3]=new objItem("檔案備份","../appendix/archive.htm");
arTree[i][4]=new objItem("參考文獻","../appendix/reference.htm");
i++;
arTree[i]=new Array();
arTree[i][0]="其他主題";
arTree[i][1]=new objItem("帕海貝爾 卡農","../miscellanea/canon/canon.htm");
GstrTreeStructor="<table id=tabTree border=0 cellspacing=0 cellpadding=0";
GstrTreeStructor+=" style=\"position:relative; left:6; visibility=hidden;\" >";
//從 arTree 的子選單 arTree[1] 開始輸出
for(i=1; i<arTree.length-1; i++) treeBuild(arTree[i],"mid");
treeBuild(arTree[arTree.length-1],"end");
//從 arTree 根目錄開始輸出
//treeBuild(arTree,"mid");
GstrTreeStructor+="</table>";
document.write(GstrTreeStructor);
document.all.img1.click();
document.all.tabTree.style.visibility="visible";
}//end of treeCreate()
//-->
</script>
</head>
<body>
<script language="javascript">treeCreate();</script>
<br>
</body>
</html>