实现基于php和MySQL的动态树型菜单

树型菜单在很多桌面应用系统中都有非常广泛的应用，其主要优点是结构清晰，利于使用者非常清楚的知道目前自己所在的位置。但在web上树型菜单的应用因为没有理想的现成组件可以拿过来直接使用，所以一般的情况下，程序员主要是通过JavaScript来实现一些简单的树型结构菜单，但这些菜单往往都是事先定好各菜单项目，以及各菜单项目之间的层次关系，不利于扩充，一旦需要另一个菜单结构时，往往还需要重新编写，因此使用起来不是很方便。 80f5 eqa  
  经过对函数递归的研究，我发现这种树型菜单可以通过递归函数，使树型菜单的显示实现动态变化，并没有级数的限制。下面就是我用php,MySQL,JavaScript写的一个动态树型菜单的处理代码，如果大家有兴趣的话，就和我一起来看看我是如何实现的吧：） O]MFnJ
F  
>iL)s~3  
首先，我们需要一个数据库，在这个数据库中，我们建立以下一张表： Y5*C ,\p  
{|s4
fe5  
1C`wXmQM  
CREATE TABLE menu ( jX4.T;yR  
id tinyint(4) NOT NULL auto_increment, yytj9Qx~"  
parent_id tinyint(4) DEFAULT '0' NOT NULL, eUP,N e+  
name varchar(20), ] q6@V  
url varchar(60), 31D$-&]~/  
PRIMARY KEY (id) 5c#LT&HLJJ  
); Z%&w)*Rd|  
HuO(4J4  
E,IYK kw'  
这张表中 N3f[Hp&4p  
id 为索引 C_KL<. [@  
parent_id 用来保存上一级菜单的id号，如果是一级菜单则为0 6r>8DT{C]  
name 为菜单的名称，也就是要在页面上显示的菜单内容 |>KT 
url 如果某菜单为末级菜单，则需要指定该连接的url地址，这个字段就是用来保存此地址的，其他非末级菜单，该字段为空 a]s-}1>  
u4lsc]-On  
好了，数据库有了，你就可以添加一些记录了，下面是我做测试的时候，使用的一些记录： 6%0qNG  
fuI3d(xf  
INSERT INTO menu VALUES ( '1', '0', '人事管理', ''); ,})*OB\-H  
INSERT INTO menu VALUES ( '2', '0', '通讯交流', ''); PhjTGg}pP  
INSERT INTO menu VALUES ( '3', '1', '档案管理', ''); l6tp!!\  
INSERT INTO menu VALUES ( '4', '1', '考勤管理', ''); & 
INSERT INTO menu VALUES ( '5', '2', '通讯录', ''); :%v_o5Hi  
INSERT INTO menu VALUES ( '6', '2', '网络会议', ''); 84a}z,SG{  
INSERT INTO menu VALUES ( '7', '3', '新增档案', ''); ;jZW}`3=  
INSERT INTO menu VALUES ( '8', '3', '查询档案', ''); _;}}*iAC[  
INSERT INTO menu VALUES ( '9', '3', '删除档案', ''); f:-0Xy  
INSERT INTO menu VALUES ( '10', '5', '新增通讯记录',''); Lsgtb3WMa  
INSERT INTO menu VALUES ( '11', '5', '查询通讯记录', '); 3e+)@T  
INSERT INTO menu VALUES ( '12', '5', '删除通讯记录', '); ktY,Ngf  
INSERT INTO menu VALUES ( '13', '6', '召开会议', ''); Y[{VEmA  
INSERT INTO menu VALUES ( '14', '6', '会议查询', ''); m)/f#:l.A  
vlJfi1T"k  
x`l^.>"  
在添加记录的时候，一定要注意，非一级菜单的parent_id一定要指定为上级菜单的ID号，否则你的菜单是不会显示出来的：） O\hSd_~   
z~{%{jnPu  
好了！有了数据库，下面就是通过php,JavaScript把菜单从数据库中读出来，并显示出来了：） v,];*I:=  
h]n* PL  
1、JavaScript脚本： 0/';VHs  
function ShowMenu(MenuID) kuZeH,'4)  
{ b8#OTU'  
if(MenuID.style.display=="none") w}w:!^  
{ r4)}?k_3y  
MenuID.style.display=""; ,X?u{,  
} x%>0Ld:ox  
else  y}}}\G  
{ c*'^,1*  
MenuID.style.display="none"; 4-t:? ^Q  
} ;_$\mS1  
} nPt&={  
=O;&28[^  
这个脚本很简单，就是用来响应点击某个菜单被点击的事件的。 9/0tys*  
z^]$Wj7?  
2、CSS文件： n d2o&,  
w
u-'wBdz  
TD { |Cbo[ F)S  
FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; LINE-HEIGHT: 130%; letter-spacing:1px }Q&6_JYY  
} G^%X>5Kb  
x Ef4L}  
WyGxk
sE  
A:link { W$) 
COLOR: #990000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; TEXT-DECORATION: none; letter-spacing:1px N2F[Ai`  
} cn
7X"#r&  
A:visited { I?^~B:OH  
COLOR: #990000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; TEXT-DECORATION: none; letter-spacing:1px ,\C 
} dE udq  
A:active { gi[j33!=`  
COLOR: #990000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; TEXT-DECORATION: none; letter-spacing:1px O5Jx$ 4OFn  
} ,4#jsH@  
A:hover { <jHQ /q  
COLOR: #ff0000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; TEXT-DECORATION: underline; letter-spacing:1px t83a ,  
} {+@oE5/J/a  
Cg?3'8Q4  
@:\#[>PuH  
.Menu { q&,3s?  
COLOR:#000000; FONT-FAMILY: "Verdana", "宋体"; FONT-SIZE: 12px; CURSOR: hand jLG8^RCD  
} p|iua-'y  
pkUIzEgl  
Tjrq"QqDZ  
定义了一些基本的样式信息，比如字体，颜色，超级连接的样式等，如果你想改变样式的话，只要修改这里就行了！ N'K+J$e?$  
0AJtg'rD$  
3、下面就是我的php页面了！ `'H3,^!H  
7 2|"gSq  
/K$ 
+ f1 .)7  
$&>Nw{pcC  
,p'B*zj  

O,CR
]R\  
U7[79qtp  
e6_Rtz0a  
//基本变量设置 9&`Nh  
$GLOBALS["ID"] =1; //用来跟踪下拉菜单的ID号 @,6q/|Wi  
$layer=1; //用来跟踪当前菜单的级数 R{Q%dWKu5  
P6?lGz&(`  
//连接数据库 Z,/<5;W e  
$Con=mysql_connect("localhost","root",""); l,10v?:97  
mysql_select_db("work"); dP[_1e  
R:6\4,d  
//提取一级菜单 dbV6Go2j  
$sql="select * from menu where parent_id=0"; ]uASM6}H  
$result=mysql_query($sql,$Con); v=7 "B"  
Yo@_+b)&\  
//如果一级菜单存在则开始菜单的显示 5.IdfiY  
if(mysql_num_rows($result)>0) ShowTreeMenu($Con,$result,$layer,$ID); -Kp=LD7'  
viJtaO  
/p X,W  
//============================================= baf #]*^3  
//显示树型菜单函数 ShowTreeMenu($con,$result,$layer) q rGU@e  
//$con：数据库连接 P}DJx2,{^  
//$result：需要显示的菜单记录集 ^V"}J8|jh  
//layer：需要显示的菜单的级数 e.HGlx"Z  
//============================================= 5J@/CSw~  
function ShowTreeMenu($Con,$result,$layer) 73;xC+x  
{ 2XHG75YE  
//取得需要显示的菜单的项目数 9hP/\`  
$numrows=mysql_num_rows($result); 5N'I#j HE  
yFz
O~L`5  
//开始显示菜单，每个子菜单都用一个表格来表示 U_224rz0  
echo ""; "v#9L_tZ  
#oofEGV]  
for($rows=0;$rows<$numrows;$rows++) X'#" !o0g#  
{ 2tl ~F[  
//将当前菜单项目的内容导入数组 6-4a4{,{  
$menu=mysql_fetch_array($result); |_yj 
,g[rp1?j  
//提取菜单项目的子菜单记录集 %N An"  
$sql="select * from menu where parent_id=$menu[id]"; 9f23HK`9  
$result_sub=mysql_query($sql,$Con); JWY# }B8h  
$Tpx A  
echo ""; vo4kp76 _h  
//如果该菜单项目有子菜单，则添加JavaScript onClick语句 #hkwHs3\  
if(mysql_num_rows($result_sub)>0) UPP6Bp  
{ ;"%uC*r
 
echo ""; okZ]i%H  
echo ""; Q&&ycD<  
echo "=Rs"+Oo  
pl7x@DN1  
"; IG\~6P 
:; !R.C/  
//如果该菜单项目有子菜单，则显示子菜单 gwTS6) Yq  
if(mysql_num_rows($result_sub)>0) wR>7@pW]  
{ g]IfxP  
//指定该子菜单的ID和style，以便和onClick语句相对应 dM m !4cF  
echo ""; U"aV>\Fxe!  
echo ""; A )h)Z1Q  
echo ""; ]Ps )Ut  
} 5NUTzws=8  
//继续显示下一个菜单项目 =/g)az9  
} Z|I# @  
echo "

	"; \8Ghk'I\   } iaV;Tl^4+   else BE y!2`eBJ   { qxD5I>GN   echo "		"; CG~Y   } :xloO/l   //如果该菜单项目没有子菜单，并指定了超级连接地址，则指定为超级连接， r{ L5v/V3   //否则只显示菜单名称 '3C$YXwM\   if($menu[url]!="") 3fh6~!   echo "$menu[name]"; I}%g5H P   else 01SN&U   echo $menu[name]; Ym"Bi/   echo " ?Q4< WT
	"; >VH;>lJ]zI   //将级数加1 DI_@I"2 T   $layer++; 8! D-:B   //递归调用ShowTreeMenu()函数，生成子菜单 ,0j32YT^   ShowTreeMenu($Con,$result_sub,$layer); fwe nN   //子菜单处理完成，返回到递归的上一层，将级数减1 vIC&X  $layer--; `v3kXWsY   echo "

"; nN3~1;=/  
}
m5I+h0EW  
?> JX Ur]09'~  
`7"nu3?  

7dV*5 "5  
 S(e>')  
^_,)Bqv^-  
在上面的php页面里面，我定义了一个函数ShowTreeMenu()，通过这个函数的调用，会从数据库中递归的调出每个菜单项目，并显示在页面上了：）