数据存储形式
折叠菜单显示
直接调用.php页面即可输出树状可折叠菜单
所用到的js
//区域折叠函数
function ShowMenu(MenuID)
{
if(MenuID.style.display=="none")
{
MenuID.style.display="";
}
else
{
MenuID.style.display="none";
}
}
//控制鼠标经过表格,表格颜色变化(在Firefox效果不明显)
function out()
{
var obj = event.srcElement;
if(obj.tagName.toLowerCase() == "td")
{
var otr = obj.parentNode;
if(!otr.tag)
{
otr.style.backgroundColor = "";
}
}
}
function over()
{
var obj = event.srcElement;
if(obj.tagName.toLowerCase() == "td")
{
var otr = obj.parentNode;
if(!otr.tag)
{
otr.style.backgroundColor = "#E1E9FD";
}
}
}
<?php
/*
* Copyright (C), 2014-2015, xx Tech. Co., Ltd.
*
* File: tree.php
* Author: hu, jiangwen
*
* Description:从数据库读取节点数据并以树状的形式体现,支持折叠.
*
* History:
* Date Author Description
* ---------------------------------------------------------
* 14/04/23 hujw Initial creation
*
*/
include("../../config/config.db.php");
if (isset($_SESSION["username"]))
{
$area = $_SESSION['area'];
$GLOBALS["id"] = 1; //用来跟踪下拉菜单的id号
$layer = 1; //用来跟踪当前菜单的级数
$db_hostname = $db_config["hostname"]; //服务器地址
$db_username = $db_config["username"]; //数据库用户名
$db_password = $db_config["password"]; //数据库密码
$db_database = $db_config["database"]; //数据库名称
$db_charset = $db_config["charset"] ; //数据库编码
if ($db_hostname != "" && $db_username != "" && $db_database != "")
{
$conn = mysql_connect($db_hostname,$db_username,$db_password);
mysql_select_db($db_database);
mysql_query("set names ".$db_charset);
//提取顶级菜单
$sql="select * from mcp_node where `node_code` = '{$area}' ";
$result = @mysql_query($sql,$conn);
//如果顶级菜单存在则开始菜单的显示
if( @mysql_num_rows($result) >0 )
{
ShowTreeMenu($conn,$result,$layer);
}
else
{
echo "节点数据为空";
}
}
else
{
echo "数据库配置错误";
}
}
//显示树型菜单函数 ShowTreeMenu($conn,$result,$layer)
//$conn:数据库连接
//$result:需要显示的菜单记录集
//layer:需要显示的菜单的级数
function ShowTreeMenu($conn,$result,$layer)
{
//取得需要显示的菜单的项目数
$numrows= mysql_num_rows($result);
//开始显示菜单,每个子菜单都用一个表格来表示
echo "<table>";
for( $rows = 0; $rows < $numrows ; $rows++)
{
//将当前菜单项目的内容导入数组
$menu = mysql_fetch_assoc($result);
//提取菜单项目的子菜单记录集
$sql="select * from mcp_node where `node_pcode` = '{$menu['node_code']}'";
$result_sub=mysql_query($sql,$conn);
echo "<tr onMouseOver='over()' onMouseOut='out()'>";
//如果该菜单项目有子菜单,则添加javascript onclick语句
if (mysql_num_rows($result_sub)>0)
{
echo "<td width='20'><img src='../../img/icons/unfold.gif' border='0'></td>";
echo "<td class='Menu' onClick='javascript:ShowMenu(Menu".$GLOBALS["id"].");'>";
}
else
{
echo "<td width='10'><img src='../../img/icons/fold.gif' border='0'></td>";
echo "<td class='Menu'>";
}
//show_local_tab()定义于 commom.js文件.
echo "<a href='#' οnclick=\"show_local_tab('{$menu['node_code']}','{$menu['node_name']}')\"><font size = 3>".$menu['node_name']."</font></a>";
echo "</td></tr>";
//如果该菜单项目有子菜单,则显示子菜单
if (mysql_num_rows( $result_sub ) > 0)
{
//指定该子菜单的id和style,以便和onClick语句相对应
echo "<tr id = Menu".$GLOBALS["id"]++." style='display:none'>";
echo "<td></td>";
echo "<td>";
//将级数加1
$layer++;
//递归调用ShowTreeMenu()函数,生成子菜单
ShowTreeMenu($conn,$result_sub,$layer);
//子菜单处理完成,返回到递归的上一层,将级数减1
$layer--;
echo "</td></tr>";
}
}
echo "</table>";
}
?>