其实网上现在用JS来实现一个树形的代码多得不成样子了.不过偶觉得这个还算可以的(至少比我第一次写的那个强多了o_o)
我在WEB中JS初始化如下:
< script language = " javascript " >
Show_Root = 2
Insert_ID = " content "
Target_Text = " ContentCortrol "
Root_Name = " n0 "
var myurl = " http://www.blogjava.net/jkallen " ;
// 我以当节点处于1， 4 ，7的时候作为父节点处理
var n0 = new Node( " n0 " , " 节点0 " ,myurl, " none " );
var n1 = n0.createChild( " n1 " , " 节点1 " ,myurl, " none " ) ;
var n2 = n1.createChild( " n2 " , " 节点2 " ,myurl, " none " ) ;
var n3 = n1.createChild( " n3 " , " 节点3 " ,myurl, " none " ) ;
var n4 = n0.createChild( " n4 " , " 节点4 " ,myurl, " none " ) ;
var n5 = n4.createChild( " n5 " , " 节点5 " ,myurl, " none " ) ;
var n6 = n4.createChild( " n6 " , " 节点6 " ,myurl, " none " ) ;
var n7 = n0.createChild( " n7 " , " 节点7 " ,myurl, " none " ) ;
var n8 = n7.createChild( " n8 " , " 节点8 " ,myurl, " none " ) ;
var n9 = n0.createChild( " n9 " , " 节点9 " ,myurl, " none " ) ;
loadPage( " n0 " )
</ script >
看起来相当笨拙.但这仅是为了表现JS罢了,其实各种node完全可以在bean中实现才是(node value也正是从DB是取才是啊)!
先来看效果啦:
其中一些主要的JS代码分别如下:
Node的定义：
function Node(name, text, link, status)
![]()
产生子节点:
function expandChild(iRoot)
![]()
展开父节点:
function expandChild(iRoot)
![]()
注意:
从以上可以看到在WEB页面中得有相关JS代码初始化Insert_ID（create space to storage the menu） 如：
< table width ="100%" >
< tr >
< td valign ="top" id ="content" nowrap >
</ td >
</ tr >
</ table >
Insert_ID = "content"//JS代码
在WEB页面中得初始化Root_Name(此处为"n0")
JS中没有提供对父节点的判断，而是直接（依据当前节点的下标）取得某一节点的父节点（反正菜单项一般是从DB中select的，所以你可以在bean中去处理）.我觉得也许可以将此功能也在JS中实现,将DB中的数据直接提到XML(or我们JS是从JS中提取数据的)....