萬盛學電腦網 >> 網絡編程 >> jsp編程 >> JSP頁面文件目錄樹源碼(遞歸算法)
JSP頁面文件目錄樹源碼(遞歸算法)
<%@ page contentType="text/html; charset=gb2312" language="java" import="java.sql.*" errorPage="" %>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312"; >
<script language="JavaScript">
<!--
function MM_goToURL() { //v3.0
var i, args=MM_goToURL.arguments; document.MM_returnValue = false;
for (i=0; i<(args.length-1); i+=2) eval(args[i]+".location='"+args[i+1]+"'");
}
//-->
</script>
<link href="css/ip.css" rel="stylesheet" type="text/css">
</head>
<body topmargin = "0" leftmargin = "0" marginheight = "0" marginwidth = "0" bgcolor="#FFFFFF">
<table border="0" cellspacing="0" cellpadding="0" height="80%">
<tr><td>
</td>
</tr>
<tr valign="top">
<td height="223"> <span id="menus"></span>
<span id="view"></span>
</td>
</tr>
<tr valign="bottom">
<td> </td>
</tr>
</table>
<div align="right"></div>
</body>
<script>
/**
* 構造樹，初值為0
*/
function isbrother()
{
var is=flase;
}
function tree(n) {
var id = new Array("bar","pad","<IMG src='http://www.webjx.com/htmldata/2005-08-02/images/midnodeline.gif'border=0 align='absmiddle'><IMG src='http://www.webjx.com/htmldata/2005-08-02/images/close.gif 'border=0 align='absmiddle'>","<IMG src='http://www.webjx.com/htmldata/2005-08-02/images/midclosedfolder.gif 'border=0 align='absmiddle'><IMG src='http://www.webjx.com/htmldata/2005-08-02/images/close.gif 'border=0 align='absmiddle'>","<IMG src='http://www.webjx.com/htmldata/2005-08-02/images/lastnodeline.gif'border=0 align='absmiddle'><IMG src='http://www.webjx.com/htmldata/2005-08-02/images/close.gif 'border=0 align='absmiddle'>");
if(n == 0) { // 初始化變量
n = 1;
i = 0;
s = "";
}
s += "<table border=0 cellspacing=0 cellpadding=0 >";
for(;i<tree_ar.length-1;i++) {
var k = (n >= tree_ar[i+1][0])?0:1;
if(tree_ar[i][2]==false)
{
id[2]="<IMG src='http://www.webjx.com/htmldata/2005-08-02/images/lastnodeline.gif'border=0 align='absmiddle'><IMG src='http://www.webjx.com/htmldata/2005-08-02/images/close.gif 'border=0 align='absmiddle'>";
}
s += "<tr id='"+id[k]+"' value="+i+"><td >"+id[k+2]+"</td><td>"+tree_ar[i][1]+"</td></tr>"; // // 構造節點，注意這裡的自定義屬性value。作用是簡化構造節點的描述，共享參數數組信息。
if(n > tree_ar[i+1][0]) { // 若期望層次大於當前層次，結束本層次返回上一層次。
s += "</td></tr></table>";
return tree_ar[i+1][0];
}
if(n < tree_ar[i+1][0]) { // 若期望層次小於當前層次，遞歸進入下一層次。
s += "<tr style='display:none' ><td ";
if(tree_ar[i][2]==true)
{ //如果有下個兄弟節點,則畫兄弟節點間的連線
s+="background='images/line.gif' border=0 align='absmiddle'";
}
s+="></td><td>";
var m = tree(tree_ar[++i][0]);
s += "</td></tr>";
if(m < n) { // 當遞歸返回值小於當前層次期望值時，將產生連續的返回動作
s += "</table>";
return m;
}
}
}
s += "</table>";
return s;
}
</script>
<script for=pad event=onclick>
// 分枝節點的點擊響應
v = this.parentElement.rows[this.rowIndex+1].style;
if(v.display == 'block') {
v.display = 'none';
this.cells[0].innerHTML = "<IMG src='http://www.webjx.com/htmldata/2005-08-02/images/midclosedfolder.gif 'border=0 align='absmiddle'><IMG src='http://www.webjx.com/htmldata/2005-08-02/images/close.gif 'border=0 align='absmiddle'>";
view.innerHTML = "";// 自行修改為參數數組定義的閉合動作
}else {
v.display = 'block';
this.cells[0].innerHTML = "<IMG src='http://www.webjx.com/htmldata/2005-08-02/images/midopenedfolder.gif 'border=0 align='absmiddle'><IMG src='http://www.webjx.com/htmldata/2005-08-02/images/open.gif 'border=0 align='absmiddle'>";
// view.innerHTML = "<b>"+tree_ar[this.value][1]+"</b>"; // 自行修改為參數數組定義的展開動作
}
/**
* 以下代碼用於關閉已展開的其他分枝
* 如需自行關閉展開的分枝則從這裡直接返回或刪去這段代碼
*/
if(! tree_ar[this.value].type) //如該節點為首次進入，則記錄所在層次信息
genTreeInfo(this);
var n = 1*this.value+1;
for(i=n;i<tree_ar.length-1;i++) { // 關閉排列在當前節點之後的樹
if(tree_ar[i].type == "pad") {
tree_ar[i].obj2.style.display = 'none';
tree_ar[i].obj1.cells[0].innerHTML = "<IMG src='http://www.webjx.com/htmldata/2005-08-02/images/midclosedfolder.gif 'border=0 align='absmiddle'><IMG src='http://www.webjx.com/htmldata/2005-08-02/images/close.gif 'border=0 align='absmiddle'>";
}
}
while(tree_ar[--n][0] > 1); //回溯到當前樹的起點
while(--n >= 0) // 關閉排列在當前樹的起點之前的樹
if(tree_ar[n].type == "pad") {
tree_ar[n].obj2.style.display = 'none';
tree_ar[n].obj1.cells[0].innerHTML = "<IMG src='http://www.webjx.com/htmldata/2005-08-02/images/midclosedfolder.gif 'border=0 align='absmiddle'><IMG src='http://www.webjx.com/htmldata/2005-08-02/images/open.gif 'border=0 align='absmiddle'>";
}
/** 記錄層次信息，用以簡化遍歷樹時的復雜的節點描述 **/
function genTreeInfo(o) {
var el = o.parentElement;
for(var i=0;i<el.rows.length;i++) {
if(el.rows[i].id != "") {
tree_ar[el.rows[i].value].type = el.rows[i].id;
}
if(el.rows[i].id == "pad") {
tree_ar[el.rows[i].value].obj1 = el.rows[i];
tree_ar[el.rows[i].value].obj2 = el.rows[i+1];
}
}
}
</script>
<script for=bar event=onclick>
// 無分枝節點的點擊響應
//view.innerHTML = "<b>"+tree_ar[this.value][1]+"</b>"; // // 自行修改為參數數組定義的點擊動作
// 自行修改為參數數組定義的點擊動作
</script>
<script for=bar event=onclick>
// 無分枝節點的點擊響應
//view.innerHTML = "<b>"+tree_ar[this.value][1]+"</b>"; // uFFFDuFFFDuFFFDsuFFFDCuFFFDuFFFD?uFFFDQuFFFDuFFFDuFFFDuFFFD?uFFFDuFFFD?uFFFDIuFFFD_??uFFFDuFFFD
</script>
<script>
/**
* 基本參數數組，根據具體應用自行擴展
* 數據可較簡單的由服務器端提供
* 列1：節點層次
* 列2：節點標題
* 列3: 有無下個兄弟節點
* 其余自行擴充
*/
tree_ar = new Array(
