前几天一个同事跟我说用'梅花雪'创建树型菜单很简单,下过来一个自己也试了下.果然很好用
直接从数据库里取记录
Code1
CREATE TABLE IF NOT EXISTS `category` (2
`categoryid` int(11) NOT NULL auto_increment,3
`categoryname` varchar(255) collate latin1_general_ci NOT NULL,4
`parentid` int(11) NOT NULL,5
PRIMARY KEY (`categoryid`)6
) ENGINE=MyISAM DEFAULT CHARSET=latin1 COLLATE=utf8_general_ci;7
8
--9
-- 导出表中的数据 `category`10
--11
12
INSERT INTO `category` (`categoryid`, `categoryname`, `parentid`) VALUES13
(1, 'art', 0),14
(2, 'music', 1),15
(3, 'blue music', 2),16
(4, 'rock music', 2),17
(5, 'life', 0),18
(6, 'housework', 5),19
(7, 'travelling', 5),20
(8, 'mountain climbing', 7),21
(9, 'food', 0),22
(10, 'shopping', 0);
MzTreeView10.php 用PHP取出所有记录,并且设置 MzTreeView 类
Code1
<html>2
<head>3
<script language=javascript>
var t1 = new Date().getTime();</script>4
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">5
<meta content="F.R.Huang(meizz梅花雪)//www.meizz.com" name="author">6
<script language="JavaScript" src="MzTreeView10.js"></script>7
<title>梅花雪中文网 - WEB版块管理界面</title>8
<style type="text/css">9
body, td10
{}{11
font-family: 宋体;12
font-size: 12px;13
}14
A:LINK, A:VISITED, A:ACTIVE, A:HOVER15
{}{16
color: #800080;17
font-size: 13px;18
padding-left: 3px;19
TEXT-DECORATION: NONE;20
}21
</style>22
23
</head>24
25
<body>26
<h3>梅花雪ＷＥＢ脚本控件集 - MzTreeView 1.0 树 - 测试页面</h3>27
<?php28
$db = mysql_connect('localhost', 'root', '');29
mysql_select_db('test');30
31
$parentid = 0;32
$arr = array();33
34
$rowTotalNum = 0;35
do {36
$query = 'SELECT categoryid, categoryname, parentid '37
.' FROM category WHERE parentid IN (' . $parentid . ')';38
39
$rs = mysql_query($query);40
$currentRowNum = mysql_num_rows($rs);41
$parentid = '';42
$nextParent = array();43
if ( $currentRowNum > 0 ) 44
{45
for($i = 1; $i <= $currentRowNum; $i++) 46
{47
$currentNodeId = $rowTotalNum + $i +1;48
49
$row = mysql_fetch_object($rs);50
if ($row->parentid == 0) {51
$level = 1;52
} else {53
$level = $arr[$row->parentid]->sequence;54
}55
$row->level = $level;56
$row->sequence = $currentNodeId;57
$row->nodeid = $level . '_' . $currentNodeId;58
$arr[$row->categoryid] = $row;59
$nextParent[] = $row->categoryid;60
}61
62
if ( count($nextParent) > 0 ) 63
{64
$parentid = implode(', ', $nextParent);65
}66
}67
$rowTotalNum += $currentRowNum;68
} while ($parentid != '');69
mysql_close($db);70
?>71
<table width="100%" border=0 cellspacing=3 bgcolor="#B8D1F8">72
<tr>73
<td bgcolor=white valign=top>74
<div id=treeviewarea style="background-color: "></div>75
<SCRIPT LANGUAGE="JavaScript">76
<!--77
var tree = new MzTreeView("tree");78
tree.setIconPath("./");79
tree.nodes['0_1'] = '';80
<?php81
foreach($arr as $result) {82
echo "tree.nodes['" . $result->nodeid . "'] = 'text:".$result->categoryname.";url:some_link.php?categoryid=" . $result->categoryid . "';";83
}84
?>85
document.getElementById('treeviewarea').innerHTML = tree.toString();86
</SCRIPT>87
</td>88
</tr>89
</table>90
</body>91
</html>MzTreeView10.js
Code1
<!--2
/**//*---------------------------------------------------------------------------*\3
| Subject: Web TreeView Class |4
| Version: 1.0 |5
| Author: 黄方荣【meizz】【梅花雪】 |6
| FileName: MzTreeView.js |7
| Created: 2004-10-18 |8
| LastModified: 2005-03-10 |9
| Download: http://www.meizz.com/Web/Download/MzTreeView10.rar |10
| Explain: http://www.meizz.com/Web/Article.asp?id=436 |11
| Demo: http://www.meizz.com/Web/Demo/MzTreeView10.htm |12
| |13
| You may use this code on your item |14
| this entire copyright notice appears unchanged |15
| and you clearly display a link to http://www.meizz.com/ |16
| |17
|-----------------------------------------------------------------------------|18
| MSN: huangfr@msn.com QQ: 112889082 http://www.meizz.com |19
| CSDN Community ID: meizz Copyright (c) 2004-2005 meizz |20
\*---------------------------------------------------------------------------*/21
22
23
//MzTreeView1.0网页树类, 在实例化的时候请把实例名作参数传递进来24
function MzTreeView(Tname)25
{26
if(typeof(Tname) != "string" || Tname == "")27
throw(new Error(-1, '创建类实例的时候请把类实例的引用变量名传递进来！'));28
29
//【property】30
this.url = "#";31
this.target = "_self";32
this.name = Tname;33
this.wordLine = false;34
this.currentNode = null;35
this.useArrow = true;36
this.nodes = {};37
this.node = {};38
this.names = "";39
this._d = "\x0f";40
this.index = 0;41
this.divider = "_";42
this.node["0"] =43
{44
"id": "0",45
"path": "0",46
"isLoad": false,47
"childNodes": [],48
"childAppend": "",49
"sourceIndex": "0"50
};51
52
this.colors =53
{54
"highLight" : "#0A246A",55
"highLightText" : "#FFFFFF",56
"mouseOverBgColor" : "#D4D0C8"57
};58
this.icons = {59
L0 : 'L0.gif', //┏60
L1 : 'L1.gif', //┣61
L2 : 'L2.gif', //┗62
L3 : 'L3.gif', //━63
L4 : 'L4.gif', //┃64
PM0 : 'P0.gif', //＋┏65
PM1 : 'P1.gif', //＋┣66
PM2 : 'P2.gif', //＋┗67
PM3 : 'P3.gif', //＋━68
empty : 'L5.gif', //空白图69
root : 'root.gif', //缺省的根节点图标70
folder : 'folder.gif', //缺省的文件夹图标71
file : 'file.gif', //缺省的文件图标72
exit : 'exit.gif'73
};74
this.iconsExpand = { //存放节点图片在展开时的对应图片75
PM0 : 'M0.gif', //－┏76
PM1 : 'M1.gif', //－┣77
PM2 : 'M2.gif', //－┗78
PM3 : 'M3.gif', //－━79
folder : 'folderopen.gif',80
81
exit : 'exit.gif'82
};83
84
//扩展 document.getElementById(id) 多浏览器兼容性85
//id 要查找的对象 id86
this.getElementById = function(id)87
{88
if (typeof(id) != "string" || id == "") return null;89
if (document.getElementById) return document.getElementById(id);90
if (document.all) return document.all(id);91
try {return eval(id);} catch(e){ return null;}92
}93
94
//MzTreeView 初始化入口函数95
this.toString = function()96
{97
this.browserCheck();98
this.dataFormat();99
this.setStyle();100
this.load("0");101
var rootCN = this.node["0"].childNodes;102
var str = "<A id='"+ this.name +"_RootLink' href='#' style='DISPLAY: none'></A>";103
104
if(rootCN.length>0)105
{106
this.node["0"].hasChild = true;107
for(var i=0; i<rootCN.length; i++)108
str += this.nodeToHTML(rootCN[i], i==rootCN.length-1);109
setTimeout(this.name +".expand('"+ rootCN[0].id +"', true); "+ 110
this.name +".focusClientNode('"+ rootCN[0].id +"'); "+ this.name +".atRootIsEmpty()",10);111
}112
113
if (this.useArrow) //使用方向键控制跳转到上级下级父级子级节点114
{115
if (document.attachEvent)116
document.attachEvent("onkeydown", this.onkeydown);117
else if (document.addEventListener)118
document.addEventListener('keydown', this.onkeydown, false);119
}120
return "<DIV class='MzTreeView' "+121
"onclick='"+ this.name +".clickHandle(event)' "+122
"ondblclick='"+ this.name +".dblClickHandle(event)' "+123
">"+ str +"</DIV>";124
};125
126
this.onkeydown= function(e)127
{128
e = window.event || e; var key = e.keyCode || e.which;129
switch(key)130
{131
case 37 : eval(Tname).upperNode(); break; //Arrow left, shrink child node132
case 38 : eval(Tname).pervNode(); break; //Arrow up133
case 39 : eval(Tname).lowerNode(); break; //Arrow right, expand child node134
case 40 : eval(Tname).nextNode(); break; //Arrow down135
}136
};137
}138
139
//浏览器类型及版本检测140
MzTreeView.prototype.browserCheck = function()141
{142
var ua = window.navigator.userAgent.toLowerCase(), bname;143
if(/msie/i.test(ua))144
{145
this.navigator = /opera/i.test(ua) ? "opera" : "";146
if(!this.navigator) this.navigator = "msie";147
}148
else if(/gecko/i.test(ua))149
{150
var vendor = window.navigator.vendor.toLowerCase();151
if(vendor == "firefox") this.navigator = "firefox";152
else if(vendor == "netscape") this.navigator = "netscape";153
else if(vendor == "") this.navigator = "mozilla";154
}155
else this.navigator = "msie";156
if(window.opera) this.wordLine = false;157
};158
159
//给 TreeView 树加上样式设置160
MzTreeView.prototype.setStyle = function()161
{162
/**//*163
width: 16px; \164
height: 16px; \165
width: 20px; \166
height: 20px; \167
*/168
var style = "<style>"+169
"DIV.MzTreeView DIV IMG{border: 0px solid #FFFFFF;}"+170
"DIV.MzTreeView DIV SPAN IMG{border: 0px solid #FFFFFF;}";171
if(this.wordLine)172
{173
style +="\174
DIV.MzTreeView DIV\175
{\176
height: 20px;"+177
(this.navigator=="firefox" ? "line-height: 20px;" : "" ) +178
(this.navigator=="netscape" ? "" : "overflow: hidden;" ) +"\179
}\180
DIV.MzTreeView DIV SPAN\181
{\182
vertical-align: middle; font-size: 21px; height: 20px; color: #D4D0C8; cursor: default;\183
}\184
DIV.MzTreeView DIV SPAN.pm\185
{\186
width: "+ (this.navigator=="msie"||this.navigator=="opera" ? "11" : "9") +"px;\187
height: "+ (this.navigator=="netscape"?"9":(this.navigator=="firefox"?"10":"11")) +"px;\188
font-size: 7pt;\189
overflow: hidden;\190
margin-left: -16px;\191
margin-right: 5px;\192
color: #000080; \193
vertical-align: middle;\194
border: 1px solid #D4D0C8;\195
cursor: "+ (this.navigator=="msie" ? "hand" : "pointer") +";\196
padding: 0 2px 0 2px;\197
text-align: center;\198
background-color: #F0F0F0;\199
}";200
}201
style += "<\/style>";202
document.write(style);203
};204
205
//当根节点为空的时候做的处理206
MzTreeView.prototype.atRootIsEmpty = function()207
{208
var RCN = this.node["0"].childNodes;209
for(var i=0; i<RCN.length; i++)210
{211
if(!RCN[i].isLoad) this.expand(RCN[i].id);212
if (RCN[i].text=="")213
{214
var node = RCN[i].childNodes[0], HCN = node.hasChild;215
if(this.wordLine)216
{217
var span = this.getElementById(this.name +"_tree_"+ node.id);218
span = span.childNodes[0].childNodes[0].childNodes[0];219
span.innerHTML = RCN[i].childNodes.length>1 ? "┌" : "─";220
}221
else222
{223
node.iconExpand = RCN[i].childNodes.length>1 ? HCN ? "PM0" : "L0" : HCN ? "PM3" : "L3"224
this.getElementById(this.name +"_expand_"+ node.id).src = this.icons[node.iconExpand].src;225
}226
}227
}228
};229
230
//初始化数据源里的数据以便后面的快速检索231
MzTreeView.prototype.dataFormat = function()232
{233
var a = new Array();234
for (var id in this.nodes) a[a.length] = id;235
this.names = a.join(this._d + this._d);236
this.totalNode = a.length; a = null;237
};238
239
//在数据源检索所需的数据节点240
//id 客户端节点对应的id241
MzTreeView.prototype.load = function(id)242
{243
var node = this.node[id], d = this.divider, _d = this._d;244
var sid = node.sourceIndex.substr(node.sourceIndex.indexOf(d) + d.length);245
var reg = new RegExp("(^|"+_d+")"+ sid +d+"[^"+_d+d +"]+("+_d+"|$)", "g");246
var cns = this.names.match(reg), tcn = this.node[id].childNodes; if (cns){247
reg = new RegExp(_d, "g"); for (var i=0; i<cns.length; i++)248
tcn[tcn.length] = this.nodeInit(cns[i].replace(reg, ""), id); }249
node.isLoad = true;250
};251
252
//初始化节点信息, 根据 this.nodes 数据源生成节点的详细信息253
//sourceIndex 数据源中的父子节点组合的字符串 0_1254
//parentId 当前树节点在客户端的父节点的 id255
MzTreeView.prototype.nodeInit = function(sourceIndex, parentId)256
{257
this.index++;258
var source= this.nodes[sourceIndex], d = this.divider;259
var text = this.getAttribute(source, "text");260
var hint = this.getAttribute(source, "hint");261
var sid = sourceIndex.substr(sourceIndex.indexOf(d) + d.length);262
this.node[this.index] =263
{264
"id" : this.index,265
"text" : text,266
"hint" : hint ? hint : text,267
"icon" : this.getAttribute(source, "icon"),268
"path" : this.node[parentId].path + d + this.index,269
"isLoad": false,270
"isExpand": false,271
"parentId": parentId,272
"parentNode": this.node[parentId],273
"sourceIndex" : sourceIndex,274
"childAppend" : ""275
};276
this.nodes[sourceIndex] = "index:"+ this.index +";"+ source;277
this.node[this.index].hasChild = this.names.indexOf(this._d + sid + d)>-1;278
if(this.node[this.index].hasChild) this.node[this.index].childNodes = [];279
return this.node[this.index];280
};281
282
//从XML格式字符串里提取信息283
//source 数据源里的节点信息字符串(以后可以扩展对XML的支持)284
//name 要提取的属性名285
MzTreeView.prototype.getAttribute = function(source, name)286
{287
var reg = new RegExp("(^|;|\\s)"+ name +"\\s*:\\s*([^;]*)(\\s|;|$)", "i");288
if (reg.test(source)) return RegExp.$2.replace(/[\x0f]/g, ";"); return "";289
};290
291
//根据节点的详细信息生成HTML292
//node 树在客户端的节点对象293
//AtEnd 布尔值 当前要转换的这个节点是否为父节点的子节点集中的最后一项294
MzTreeView.prototype.nodeToHTML = function(node, AtEnd)295
{296
var source = this.nodes[node.sourceIndex];297
var target = this.getAttribute(source, "target");298
var data = this.getAttribute(source, "data");299
var url = this.getAttribute(source, "url");300
if(!url) url = this.url;301
if(data) url += (url.indexOf("?")==-1?"?":"&") + data;302
if(!target) target = this.target;303
304
var id = node.id;305
var HCN = node.hasChild, isRoot = node.parentId=="0";306
if(isRoot && node.icon=="") node.icon = "root";307
if(node.icon=="" || typeof(this.icons[node.icon])=="undefined")308
node.icon = HCN ? "folder" : "file";309
node.iconExpand = AtEnd ? "└" : "├";310
311
var HTML = "<DIV noWrap='True'><NOBR>";312
if(!isRoot)313
{314
node.childAppend = node.parentNode.childAppend + (AtEnd ? " " : "│");315
if(this.wordLine)316
{317
HTML += "<SPAN>"+ node.parentNode.childAppend + (AtEnd ? "└" : "├") +"</SPAN>";318
if(HCN) HTML += "<SPAN class='pm' id='"+ this.name +"_expand_"+ id +"'>+</SPAN>";319
}320
else321
{322
node.iconExpand = HCN ? AtEnd ? "PM2" : "PM1" : AtEnd ? "L2" : "L1";323
HTML += "<SPAN>"+ this.word2image(node.parentNode.childAppend) +"<IMG "+324
"align='absmiddle' id='"+ this.name +"_expand_"+ id +"' "+325
"src='"+ this.icons[node.iconExpand].src +"' style='cursor: "+ (!node.hasChild ? "":326
(this.navigator=="msie"||this.navigator=="opera"? "hand" : "pointer")) +"'></SPAN>";327
}328
}329
HTML += "<IMG "+330
"align='absMiddle' "+331
"id='"+ this.name +"_icon_"+ id +"' "+332
"src='"+ this.icons[node.icon].src +"'><A "+333
"class='MzTreeview' hideFocus "+334
"id='"+ this.name +"_link_"+ id +"' "+335
"href='"+ url +"' "+336
"target='"+ target +"' "+337
"title='"+ node.hint +"' "+338
"onfocus=\""+ this.name +".focusLink('"+ id +"')\" "+339
"onclick=\"return "+ this.name +".nodeClick('"+ id +"')\">"+ node.text +340
"</A></NOBR></DIV>";341
if(isRoot && node.text=="") HTML = "";342
343
HTML = "\r\n<SPAN id='"+ this.name +"_tree_"+ id +"'>"+ HTML 344
HTML +="<SPAN style='DISPLAY: none'></SPAN></SPAN>";345
return HTML;346
};347
348
//在使用图片的时候对 node.childAppend 的转换349
MzTreeView.prototype.word2image = function(word)350
{351
var str = "";352
for(var i=0; i<word.length; i++)353
{354
var img = "";355
switch (word.charAt(i))356
{357
case "│" : img = "L4"; break;358
case "└" : img = "L2"; break;359
case " " : img = "empty"; break;360
case "├" : img = "L1"; break;361
case "─" : img = "L3"; break;362
case "┌" : img = "L0"; break;363
}364
if(img!="")365
str += "<IMG align='absMiddle' src='"+ this.icons[img].src +"' height='20'>";366
}367
return str;368
}369
370
371
//将某个节点下的所有子节点转化成详细的<HTML>元素表达372
//id 树的客户端节点 id373
MzTreeView.prototype.buildNode = function(id)374
{375
if(this.node[id].hasChild)376
{377
var tcn = this.node[id].childNodes, str = "";378
for (var i=0; i<tcn.length; i++)379
str += this.nodeToHTML(tcn[i], i==tcn.length-1);380
var temp = this.getElementById(this.name +"_tree_"+ id).childNodes;381
temp[temp.length-1].innerHTML = str;382
}383
};384
385
//聚集到客户端生成的某个节点上386
//id 客户端树节点的id387
MzTreeView.prototype.focusClientNode = function(id)388
{389
if(!this.currentNode) this.currentNode=this.node["0"];390
391
var a = this.getElementById(this.name +"_link_"+ id); if(a){ a.focus();392
var link = this.getElementById(this.name +"_link_"+ this.currentNode.id);393
if(link)with(link.style){color=""; backgroundColor="";}394
with(a.style){color = this.colors.highLightText;395
backgroundColor = this.colors.highLight;}396
this.currentNode= this.node[id];}397
};398
399
//焦点聚集到树里的节点链接时的处理400
//id 客户端节点 id401
MzTreeView.prototype.focusLink= function(id)402
{403
if(this.currentNode && this.currentNode.id==id) return;404
this.focusClientNode(id);405
};406
407
//点击展开树节点的对应方法408
MzTreeView.prototype.expand = function(id, sureExpand)409
{410
var node = this.node[id];411
if (sureExpand && node.isExpand) return;412
if (!node.hasChild) return;413
var area = this.getElementById(this.name +"_tree_"+ id);414
if (area) area = area.childNodes[area.childNodes.length-1];415
if (area)416
{417
var icon = this.icons[node.icon];418
var iconE = this.iconsExpand[node.icon];419
var Bool = node.isExpand = sureExpand || area.style.display == "none";420
var img = this.getElementById(this.name +"_icon_"+ id);421
if (img) img.src = !Bool ? icon.src :typeof(iconE)=="undefined" ? icon.src : iconE.src;422
var exp = this.icons[node.iconExpand];423
var expE = this.iconsExpand[node.iconExpand];424
var expand= this.getElementById(this.name +"_expand_"+ id);425
if (expand)426
{427
if(this.wordLine) expand.innerHTML = !Bool ? "+" : "-";428
else expand.src = !Bool ? exp.src : typeof(expE) =="undefined" ? exp.src : expE.src;429
}430
if(!Bool && this.currentNode.path.indexOf(node.path)==0 && this.currentNode.id!=id)431
{432
try{this.getElementById(this.name +"_link_"+ id).click();}433
catch(e){this.focusClientNode(id);}434
}435
area.style.display = !Bool ? "none" : "block";//(this.navigator=="netscape" ? "block" : "");436
if(!node.isLoad)437
{438
this.load(id);439
if(node.id=="0") return;440
441
//当子节点过多时, 给用户一个正在加载的提示语句442
if(node.hasChild && node.childNodes.length>200)443
{444
setTimeout(this.name +".buildNode('"+ id +"')", 1);445
var temp = this.getElementById(this.name +"_tree_"+ id).childNodes;446
temp[temp.length-1].innerHTML = "<DIV noWrap><NOBR><SPAN>"+ (this.wordLine ?447
node.childAppend +"└" : this.word2image(node.childAppend +"└")) +"</SPAN>"+448
"<IMG border='0' height='16' align='absmiddle' src='"+this.icons["file"].src+"'>"+449
"<A style='background-Color: "+ this.colors.highLight +"; color: "+450
this.colors.highLightText +"; font-size: 9pt'>请稍候</A></NOBR></DIV>";451
}452
else this.buildNode(id);453
}454
}455
};456
457
//节点链接单击事件处理方法458
//id 客户端树节点的 id459
MzTreeView.prototype.nodeClick = function(id)460
{461
var source = this.nodes[this.node[id].sourceIndex];462
eval(this.getAttribute(source, "method"));463
return !(!this.getAttribute(source, "url") && this.url=="#");464
};465
466
//为配合系统初始聚集某节点而写的函数, 得到某节点在数据源里的路径467
//sourceId 数据源里的节点 id468
MzTreeView.prototype.getPath= function(sourceId)469
{470
471
Array.prototype.indexOf = function(item)472
{473
for(var i=0; i<this.length; i++)474
{475
if(this[i]==item) return i;476
}477
return -1;478
};479
var _d = this._d, d = this.divider;480
var A = new Array(), id=sourceId; A[0] = id;481
while(id!="0" && id!="")482
{483
var str = "(^|"+_d+")([^"+_d+d+"]+"+d+ id +")("+_d+"|$)";484
if (new RegExp(str).test(this.names))485
{486
id = RegExp.$2.substring(0, RegExp.$2.indexOf(d));487
if(A.indexOf(id)>-1) break;488
A[A.length] = id;489
}490
else break;491
}492
return A.reverse();493
};494
495
//在源代码里指定 MzTreeView 初始聚集到某个节点496
//sourceId 节点在数据源里的 id497
MzTreeView.prototype.focus = function(sourceId, defer)498
{499
if (!defer)500
{501
setTimeout(this.name +".focus('"+ sourceId +"', true)", 100);502
return;503
}504
var path = this.getPath(sourceId);505
if(path[0]!="0")506
{507
alert("节点 "+ sourceId +" 没有正确的挂靠有效树节点上！\r\n"+508
"节点 id 序列 = "+ path.join(this.divider));509
return;510
}511
var root = this.node["0"], len = path.length;512
for(var i=1; i<len; i++)513
{514
if(root.hasChild)515
{516
var sourceIndex= path[i-1] + this.divider + path[i];517
for (var k=0; k<root.childNodes.length; k++)518
{519
if (root.childNodes[k].sourceIndex == sourceIndex)520
{521
root = root.childNodes[k];522
if(i<len - 1) this.expand(root.id, true);523
else this.focusClientNode(root.id);524
break;525
}526
}527
}528
}529
};530
531
//树的单击事件处理函数532
MzTreeView.prototype.clickHandle = function(e)533
{534
e = window.event || e; e = e.srcElement || e.target;535
//alert(e.tagName)536
switch(e.tagName)537
{538
case "IMG" :539
if(e.id)540
{541
if(e.id.indexOf(this.name +"_icon_")==0)542
this.focusClientNode(e.id.substr(e.id.lastIndexOf("_") + 1));543
else if (e.id.indexOf(this.name +"_expand_")==0)544
this.expand(e.id.substr(e.id.lastIndexOf("_") + 1));545
}546
break;547
case "A" :548
if(e.id) this.focusClientNode(e.id.substr(e.id.lastIndexOf("_") + 1));549
break;550
case "SPAN" :551
if(e.className=="pm")552
this.expand(e.id.substr(e.id.lastIndexOf("_") + 1));553
break;554
default :555
if(this.navigator=="netscape") e = e.parentNode;556
if(e.tagName=="SPAN" && e.className=="pm")557
this.expand(e.id.substr(e.id.lastIndexOf("_") + 1));558
break;559
}560
};561
562
//MzTreeView 双击事件的处理函数563
MzTreeView.prototype.dblClickHandle = function(e)564
{565
e = window.event || e; e = e.srcElement || e.target;566
if((e.tagName=="A" || e.tagName=="IMG")&& e.id)567
{568
var id = e.id.substr(e.id.lastIndexOf("_") + 1);569
if(this.node[id].hasChild) this.expand(id);570
}571
};572
573
//回到树当前节点的父层节点574
MzTreeView.prototype.upperNode = function()575
{576
if(!this.currentNode) return;577
if(this.currentNode.id=="0" || this.currentNode.parentId=="0") return;578
if (this.currentNode.hasChild && this.currentNode.isExpand)579
this.expand(this.currentNode.id, false);580
else this.focusClientNode(this.currentNode.parentId);581
};582
583
//展开当前节点并584
MzTreeView.prototype.lowerNode = function()585
{586
if (!this.currentNode) this.currentNode = this.node["0"];587
if (this.currentNode.hasChild)588
{589
if (this.currentNode.isExpand)590
this.focusClientNode(this.currentNode.childNodes[0].id);591
else this.expand(this.currentNode.id, true);592
}593
}594
595
//聚集到树当前节点的上一节点596
MzTreeView.prototype.pervNode = function()597
{598
if(!this.currentNode) return; var e = this.currentNode;599
if(e.id=="0") return; var a = this.node[e.parentId].childNodes;600
for(var i=0; i<a.length; i++){if(a[i].id==e.id){if(i>0){e=a[i-1];601
while(e.hasChild){this.expand(e.id, true);602
e = e.childNodes[e.childNodes.length - 1];}603
this.focusClientNode(e.id); return;} else {604
this.focusClientNode(e.parentId); return;}}}605
};606
607
//聚集到树当前节点的下一节点608
MzTreeView.prototype.nextNode = function()609
{610
var e = this.currentNode; if(!e) e = this.node["0"];611
if (e.hasChild){this.expand(e.id, true);612
this.focusClientNode(e.childNodes[0].id); return;}613
while(typeof(e.parentId)!="undefined"){614
var a = this.node[e.parentId].childNodes;615
for(var i=0; i<a.length; i++){ if(a[i].id==e.id){616
if(i<a.length-1){this.focusClientNode(a[i+1].id); return;}617
else e = this.node[e.parentId];}}}618
};619
620
//展开树的所有节点621
MzTreeView.prototype.expandAll = function()622
{623
if(this.totalNode>500) if(624
confirm("您是否要停止展开全部节点？\r\n\r\n节点过多！展开很耗时")) return;625
if(this.node["0"].childNodes.length==0) return;626
var e = this.node["0"].childNodes[0];627
var isdo = t = false;628
while(e.id != "0")629
{630
var p = this.node[e.parentId].childNodes, pn = p.length;631
if(p[pn-1].id==e.id && (isdo || !e.hasChild)){e=this.node[e.parentId]; isdo = true;}632
else633
{634
if(e.hasChild && !isdo)635
{636
this.expand(e.id, true), t = false;637
for(var i=0; i<e.childNodes.length; i++)638
{639
if(e.childNodes[i].hasChild){e = e.childNodes[i]; t = true; break;}640
}641
if(!t) isdo = true;642
}643
else644
{645
isdo = false;646
for(var i=0; i<pn; i++)647
{648
if(p[i].id==e.id) {e = p[i+1]; break;}649
}650
}651
}652
}653
};654
655
//本树将要用动的图片的字义及预载函数656
//path 图片存放的路径名657
MzTreeView.prototype.setIconPath = function(path)658
{659
var k = 0, d = new Date().getTime();660
for(var i in this.icons)661
{662
var tmp = this.icons[i];663
this.icons[i] = new Image();664
this.icons[i].src = path + tmp;665
if(k==9 && (new Date().getTime()-d)>20)666
this.wordLine = true; k++;667
}668
for(var i in this.iconsExpand)669
{670
var tmp = this.iconsExpand[i];671
this.iconsExpand[i]=new Image();672
this.iconsExpand[i].src = path + tmp;673
}674
};675
676
//设置树的默认链接677
//url 默认链接 若不设置, 其初始值为 #678
MzTreeView.prototype.setURL = function(url){this.url = url;};679
680
//设置树的默认的目标框架名 target681
//target 目标框架名 若不设置, 其初始值为 _self682
MzTreeView.prototype.setTarget = function(target){this.target = target;};683
// -->
