JavaScript PHP应用二：网页设计中树形菜单的动态实现

文章作者 100test 发表时间 2007:03:14 16:29:02
来源 100Test.Com百考试题网

树形菜单，熟悉Windows程序管理器的读者一定不会陌生。单击项目左侧的 号，项目展开；再次单击，项目收缩。读过很多篇有关树形菜单的JavaScript实现方法，原理很简单，都是利用Style中display属性的控制。笔者本文的重点并不侧重于此，倒是想谈一谈如何实现每一次从数据库中提取数据并动态更新树形菜单。
　　树形菜单主要用来导航。网站有很多栏目，每个栏目下有很多子栏目，栏目经常变动，如增加新栏目，改变现有栏目名称，调整主次栏目之间关系等等，如果每一次都去改动页面代码，非常不便。而且因为信息都存放在数据库中，动态实现变得可能和必要。
　　本文并不侧重理论，只是为大家提供自己的一段代码，和大家一起来探讨一下PHP实现问题。为了便于说明，笔者对数据库作了一些改动，假设菜单字符串存放在menu表中，main字段存放主菜单字符串，sub字段存放子菜单字符串，subid字段存放子菜单标识。

$DB = new My_DB().
$DB->query("0select subid, main from menu group by main order by subid").
while ($DB->next_record()){
$Main[] = $DB->f("main").
$Key[] = $DB->f("subid").
}
/*首先，连接数据库，查询所谓的栏目名称。以上代码采用了PHPLib中的数据库函数，其中，$Main数组用来存放主菜单字符串，$Key数组用来存放子菜单关键字。大家可以采用多种方法，因人而异*/
for ($i=0.$i $j=0.
$DB->query("0select sub, subid from menu where main=´.".$Main[$i]."´.").
////利用query查询出与当前主菜单匹配的所有子菜单字符串
?>
/*以下代码和HTML代码结合到一起，大家看起来可能会不习惯，但这样代码显得简洁多了。为了模拟树形菜单，笔者源程序中使用了几个图片文件，l.gif, m.gif和p.gif，并利用onMouse事件模拟菜单的动态效果。PHP语句主要是为Javascript制作标签(tag)的id*/
width="140" border="0" cellspacing="0" cellpadding="0" class="f14">


" width="9" height="21">

&.nbsp.

" style="display:none">


width="100%" border="0" cellspacing="0" cellpadding="0" class="f9">
while ($DB->next_record()){
?>


" width="12" height="21">