本文介绍了一个使用PHP实现的树形菜单生成器类，该类支持图标和复选框两种展示风格，并提供了详细的实现代码及示例。通过简单的配置，可以快速生成具有展开和收缩功能的树形结构菜单。
<?php
/**
* Copyright (C),高西林.
* File name：class.TreeMenu.php
* Author:高西林 Version:0.1 Date:2007-10-8
* Description：树形控件--支持图标方式和checkbox两种风格.
* Others:邦定到该版本上的数据必须是数组
* History：
* <author> <time> <version> <desc>
*
*/
class TreeMenu
{
public $checkbox = false;
public $style = '';
public $datasource ;
//
public function __construct()
{
}
public function __destruct()
{
}
/**
*
*
*/
public function createTree()
{
if(!($this -> datasource) || count($this -> datasource) <= 0)return ;
$treehtml = $this -> treeScript();
$stack = array();
$parentid = 'MENU_0';
array_push($stack, $this -> datasource);
$deep = 0;
$deep2down = false;
$deep2up = true;
$childnodec = array();
while($current = array_pop($stack)){
if($deep2up){
if($deep > 0)
$treehtml .= '<table class="treestyle" border="0" cellspacing="0" cellpadding="0" id="'.$parentid.'_d"><tr><td>';
else $treehtml .= '<table class="treestyle" border="0" cellspacing="0" cellpadding="0" ><tr><td>';
if($deep == 1){
$treehtml .= '<img src="/images/menu/tree_transp.gif" border="0"/></td><td>';
}
}
$curdata = '<table class="treestyle" border="0" cellspacing="0" cellpadding="0"><tr>';
$i = $deep - 1;
while($i > 0){
$curdata .= '<td><img src="/images/menu/tree_line.gif"/></td>';
$i --;
}
$treeline = '/images/menu/tree_blank.gif';
if($current['childs']){
$treeline = '/images/menu/tree_minus.gif';
}
if( $childnodec[$deep] == 0){
if($current['childs']){
$treeline = '/images/menu/tree_minusl.gif';
}else{
$treeline = '/images/menu/tree_blankl.gif';
}
}
$parentidstr = "";
if($current['childs']){
$parentid = 'MEMU_0';
$j = $deep;
while($j > 1){
$parentid .= '_0';
$j--;
}
if($j > 0) $parentid .= '_'. $childnodec[$deep];
$parentidstr = '" id="'. $parentid .'"';
$checkboxidstr = '" id="'. $parentid .'_"';
}
$curdata .= '<td><img src="'.$treeline.'" '.$parentidstr.' class="outline" style="cursor:hand" onClick="myclick(this)"/></td>';
if($this -> checkbox){
if($current['childs']){
$curdata .= '<td><input '.$checkboxidstr.' type="checkbox" name="nodeselect[]" value="'
.$current['value'].'" onclick="treeboxselect(this)"/></td>';
}
else $curdata .= '<td><input type="checkbox" name="nodeselect[]" value="'.$current['value'].'"/></td>';
}else{
$curdata .= '<td><img src="'.$current['ico'].'" border="0" WIDTH="19" HEIGHT="17"/></td>';
}//end if
if($current['link']) {
if($current['target'])$target = $current['target'];
else $target='_self';
$curdata .='<td colspan="2"><a href="'.$current['link'].'" target="'.$target.'">'.$current['text'].'</a></td></tr></table>';
}else{
$curdata .='<td colspan="2">'.$current['text'].'</td></tr></table>';
}
$treehtml .= $curdata;
if($current['childs']){
$childs = $current['childs'];
$childnodec[$deep] -= 1;
$deep += 1;
$childnodec[$deep] = 0;
$deep2up = true;
$treehtml .= '';
$childs = array_reverse($childs);
while($child = current($childs)){
$childnodec[$deep] += 1;
array_push($stack,$child);
next($childs);
}//end while
}else{
$deep2up = false;
}//end if
if($childnodec[$deep] <= 0){
$deep -= 1;
$deep2down = true;
}else{
$childnodec[$deep] -= 1;
$deep2down = false;
}//end if
if($deep2down){
$treehtml .= ' </td></tr></table>';
}
}//end while
while($deep >= 0){
$treehtml .= ' </td></tr></table>';
$deep -= 1;
}//end while
return $treehtml;
}//end function createTreee
private function treeScript(){
$treescript = '<script type="text/javascript">';
$treescript .= '
function myclick(srcelement)
{
var targetid,targetelement;
var strbuf;
if(srcelement.className=="outline")
{
targetid=srcelement.id+"_d";
targetelement=document.all(targetid);
if (targetelement.style.display=="none")
{
targetelement.style.display=/'/';
strbuf=srcelement.src;
if(strbuf.indexOf("plus.gif")>-1)
srcelement.src="/images/menu/tree_minus.gif";
else
srcelement.src="/images/menu/tree_minusl.gif";
}
else
{
targetelement.style.display="none";
strbuf=srcelement.src;
if(strbuf.indexOf("minus.gif")>-1)
srcelement.src="/images/menu/tree_plus.gif";
else
srcelement.src="/images/menu/tree_plusl.gif";
}
}
}
';
if($this -> checkbox){
$treescript .= '
function treeboxselect(srcelement){
var targetid,targetelement;
var strbuf;
targetid = srcelement.id+"d";
targetelement = document.all(targetid);
selectnode(targetelement, srcelement.checked)
}
function selectnode(node, tostate)
{
if(node.nodeName == "INPUT")
{
node.checked = tostate;
return;
}
var childrens = node.childNodes;
for(var i = 0; i < childrens.length; i++) {
selectnode(node.childNodes[i], tostate); //在每个子节点上进行递归操作
}
}
';
}
$treescript .= '</script>';
return $treescript;
}//end function treeScript
}//end class
?>
测试代码：
<?php
//include("../weblibs/framework/class.Application.php");
include("../weblibs/framework/libs/class.TreeMenu.php");
$treedata = array(
'ico' => '/images/menu/news.gif',
'text' => 'test1',
'value' => 'value1',
'childs' => array(
array('ico' => '/images/menu/news.gif',
'text' => 'test11',
'value' => 'value11',
'childs' => array(
array( 'ico' => '/images/menu/news.gif',
'text' => 'test111',
'value' => 'value111',
'link' => '#A',
'target' => 0,
'childs' => 0
),
array(
'ico' => '/images/menu/news.gif',
'text' => 'test112',
'value' => 'value112',
'link' => '#A',
'target' => 0,
'childs' => 0
)
),
array(
array( 'ico' => '/images/menu/news.gif',
'text' => 'test113',
'value' => 'value113',
'link' => '#A',
'target' => 0,
'childs' => 0
),
array(
'ico' => '/images/menu/news.gif',
'text' => 'test114',
'value' => 'value114',
'link' => '#A',
'target' => 0,
'childs' => 0
)
)
),
array( 'ico' => '/images/menu/news.gif',
'text' => 'test12',
'value' => 'value12',
'childs' => array(
array( 'ico' => '/images/menu/news.gif',
'text' => 'test141',
'value' => 'value141',
'link' => '#A',
'target' => 0,
'childs' => 0
),
array(
'ico' => '/images/menu/news.gif',
'text' => 'test142',
'value' => 'value142',
'link' => '#A',
'target' => 0,
'childs' => 0
)
)
),
array(
'ico' => '/images/menu/news.gif',
'text' => 'test13',
'value' => 'value13',
'childs' => 0
),
array( 'ico' => '/images/menu/news.gif',
'text' => 'test14',
'value' => 'value14',
'childs' => array(
array( 'ico' => '/images/menu/news.gif',
'text' => 'test141',
'value' => 'value141',
'link' => '#A',
'target' => 0,
'childs' => 0
),
array(
'ico' => '/images/menu/news.gif',
'text' => 'test142',
'value' => 'value142',
'link' => '#A',
'target' => 0,
'childs' => 0
)
)
),
array( 'ico' => '/images/menu/news.gif',
'text' => 'test15',
'value' => 'value15',
'childs' => 0
)
)
);
$tree = new TreeMenu();
$tree -> datasource = $treedata;
$tree -> checkbox = true;//制定控件风格，如果为false，则显示ico指定的图标，默认为false.
echo $tree->createTree();
?>
运行结果：
| |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
扫一扫
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
