设为首页 收藏本站
查看: 691|回复: 0

[经验分享] 将树形菜单dTree封装成PHP函数

[复制链接]

尚未签到

发表于 2017-4-10 11:41:26 | 显示全部楼层 |阅读模式
  开发
系统
时,JavaScript树形菜单组件dTree经
常要用到,为了方便使用,我将其封装成了一个 PHP
函数


这样,只要控制传入的菜单数据
,即可动态创建菜单树。
  大家也可参看我的《Qee开源社区》论坛贴:http://qeephp.com/bbs/viewthread.php?tid=8468&highlight=dtree



1、dTree的下载


http://destroydrop.com/javascripts/tree/


/**
* menu -- dTree 树形菜单函数
*
* @param array $menus  // 菜单数据(数组)
*                 菜单数据样板:
*                 $menus = array(
*                         array('menu_id' => 0, 'parent_id' => -1, 'name' => '首页'),
*                        array('menu_id' => 1, 'parent_id' => 0, 'name' => 'Node 1'),
*                        array('menu_id' => 2, 'parent_id' => 0, 'name' => 'Node 2', 'url' => 'example01.html'),
*                        array('menu_id' => 3, 'parent_id' => 1, 'name' => 'Node 1.1'),
*                        array('menu_id' => 4, 'parent_id' => 0, 'name' => 'Node 3', 'url' => 'example01.html'),
*                        array('menu_id' => 5, 'parent_id' => 3, 'name' => 'Node 1.1.1'),
*                         array('menu_id' => 6, 'parent_id' => 5, 'name' => 'Node 1.1.1.1', 'url' => 'example01.html'),
*                        array('menu_id' => 7, 'parent_id' => 0, 'name' => 'Node 4', 'url' => 'example01.html'),
*                        array('menu_id' => 8, 'parent_id' => 1, 'name' => 'Node 1.2', 'url' => 'example01.html'),
*                        array('menu_id' => 9, 'parent_id' => 0, 'name' => 'My Pictures', 'title' => 'Pictures I\'ve taken over the years','','','img/imgfolder.gif'),
*                        array('menu_id' => 10, 'parent_id' => 9, 'name' => 'The trip to Iceland', 'url' => 'example01.html', 'title' => 'Pictures of Gullfoss and Geysir'),
*                        array('menu_id' => 11, 'parent_id' => 9, 'name' => 'Mom\'s birthday', 'url' => 'example01.html'),
*                        array('menu_id' => 12, 'parent_id' => 0, 'name' => 'Recycle Bin', 'url' => 'example01.html', 'icon' => 'img/trash.gif'),
*                );
*                 menu_id: 表示当前节点的ID        
*                parent_id: 表示当前节点的父节点的ID,根节点的值为 -1      
*                name: 节点要显示的文字      
*                url: 节点的Url        
*                title: 鼠标移至该节点时节点的提示文本        
*                target: 点击节点时,在目标窗口打开链接,可以是 _blank,_parent,_self,_top,甚至 mainFrame
*                icon: 用做节点关闭时的图标,节点没有指定图标时使用默认值   
*                iconOpen: 用做节点打开时的图标,节点没有指定图标时使用默认值   
*                open: 节点的默认打开状态,true打开,false关闭(不过它会读cookie, 所以有时看不出效果)
*                 说明: menu_id、parent_id、name 三个参数为必需,不能忽略
*
* @param array $confOpts   // dTree 配置选项参数(数组)
*                 $opts = array(
*                         'target' => 'true'|string,    // 指定所有节点在新窗口中打开链接,默认为 true
*                         'folderLinks' => 'true',      // 文件夹可链接,默认为 true
*                         'useSelection' => 'true',     // 节点被选择时高亮显示,默认为 true
*                         'useCookies' => 'true',       // 用Cookies保存树的当前状态,默认为 true
*                         'useLines' => 'true',         // 创建带线的树,默认为 true
*                         'useIcons' => 'true',         // 创建带有图标的树,默认为 true
*                         'useStatusText' => 'false',   // 在底部的状态栏中显示节点名还是显示节点的url,默认为 false
*                        'closeSameLevel' => 'false',  // 同级节点树只能展开一个,默认为 false
*                         'inOrder' => 'false',         // 如果父级节点总是添加在子级节点之前,使用这个参数可以加速菜单显示,默认为 false
*                );
*
* @return JavaScript 脚本代码
*
* 使用方法:
*
* 1、在网页模版的<head></head>中插入下面代码:
*
* <head>
*  <link rel="StyleSheet" href="dtree.css" type="text/css" />
*        <script type="text/javascript" src="dtree.js"></script>
* </head>
*
* 2、在<body></body>中要显示菜单的地方,加入下面代码:
*
* <body>
*   <?php
*            $menus = array( ... );
*     $opts = array( ... );
*     echo menu($menus, $opts);
*   ?>
* </body>
*
* @update:2009/08/09
* @author hegz
*
*/
function menu(& $menus, $confOpts = null) {
//$opts = array('target', 'folderLinks', 'useSelection', 'useCookies', 'useLines', 'useIcons', 'useStatusText', 'closeSameLevel', 'inOrder');
$output = '';
$output .= "<div class=\"dtree\">\n";
$output .= "<p><a href=\"javascript: d.openAll();\">全部展开</a> | <a href=\"javascript: d.closeAll();\">全部折叠</a></p>\n";
$output .= "<script type=\"text/javascript\">\n";
$output .= "<!--\n\n";
$output .= "d = new dTree('d');\n\n";
/**
* 设置 dTree 配置选项值
*/
if (isset($confOpts['target'])) {
$output .= "d.config.target = {$confOpts['target']};\n";
} else {
$output .= "d.config.target = true;\n";
}
if (isset($confOpts['folderLinks'])) {
$output .= "d.config.folderLinks = {$confOpts['folderLinks']};\n";
} else {
$output .= "d.config.folderLinks = true;\n";
}
if (isset($confOpts['useSelection'])) {
$output .= "d.config.useSelection = {$confOpts['useSelection']};\n";
} else {
$output .= "d.config.useSelection = true;\n";
}
if (isset($confOpts['useCookies'])) {
$output .= "d.config.useCookies = {$confOpts['useCookies']};\n";
} else {
$output .= "d.config.useCookies = true;\n";
}
if (isset($confOpts['useLines'])) {
$output .= "d.config.useLines = {$confOpts['useLines']};\n";
} else {
$output .= "d.config.useLines = true;\n";
}
if (isset($confOpts['useIcons'])) {
$output .= "d.config.useIcons = {$confOpts['useIcons']};\n";
} else {
$output .= "d.config.useIcons = true;\n";
}
if (isset($confOpts['useStatusText'])) {
$output .= "d.config.useStatusText = {$confOpts['useStatusText']};\n";
} else {
$output .= "d.config.useStatusText = false;\n";
}
if (isset($confOpts['closeSameLevel'])) {
$output .= "d.config.closeSameLevel = {$confOpts['closeSameLevel']};\n";
} else {
$output .= "d.config.closeSameLevel = false;\n";
}
if (isset($confOpts['inOrder'])) {
$output .= "d.config.inOrder = {$confOpts['inOrder']};\n";
} else {
$output .= "d.config.inOrder = false;\n\n";
}
// 添加菜单
foreach ($menus as $menu) {
if (!isset($menu['menu_id']) || !isset($menu['parent_id']) || !isset($menu['name'])) {
//js_alert('传入的菜单数据项 menu_id、parent_id 或 name 可能不存在。');
echo '传入的菜单数据项 menu_id、parent_id 或 name 可能不存在。';
return false;
}
if (!isset($menu['url']) && !isset($menu['title']) && !isset($menus['target']) && !isset($menu['icon']) && !isset($menu['iconOpen']) && !isset($menu['open'])) {
$output .= "d.add({$menu['menu_id']}, {$menu['parent_id']}, \"{$menu['name']}\");\n";
} else {
if (!isset($menu['title']) && !isset($menus['target']) && !isset($menu['icon']) && !isset($menu['iconOpen']) && !isset($menu['open'])) {
$output .= "d.add({$menu['menu_id']}, {$menu['parent_id']}, \"{$menu['name']}\", \"{$menu['url']}\");\n";
} else {
if (!isset($menus['target']) && !isset($menu['icon']) && !isset($menu['iconOpen']) && !isset($menu['open'])) {
if (!isset($menu['url'])) {
$menu['url'] = '';
}
$output .= "d.add({$menu['menu_id']}, {$menu['parent_id']}, \"{$menu['name']}\", \"{$menu['url']}\", \"{$menu['title']}\");\n";
} else {
if (!isset($menu['icon']) && !isset($menu['iconOpen']) && !isset($menu['open'])) {
if (!isset($menu['url'])) {
$menu['url'] = '';
}
if (!isset($menu['title'])) {
$menu['title'] = '';
}
$output .= "d.add({$menu['menu_id']}, {$menu['parent_id']}, \"{$menu['name']}\", \"{$menu['url']}\", \"{$menu['title']}\", '{$menu['target']}');\n";
} else {
if (!isset($menu['iconOpen']) && !isset($menu['open'])) {
if (!isset($menu['url'])) {
$menu['url'] = '';
}
if (!isset($menu['title'])) {
$menu['title'] = '';
}
if (!isset($menus['target'])) {
$menu['target'] = '';
}
$output .= "d.add({$menu['menu_id']}, {$menu['parent_id']}, \"{$menu['name']}\", \"{$menu['url']}\", \"{$menu['title']}\", '{$menu['target']}', '{$menu['icon']}');\n";
} else {
if (!isset($menu['open'])) {
if (!isset($menu['url'])) {
$menu['url'] = '';
}
if (!isset($menu['title'])) {
$menu['title'] = '';
}
if (!isset($menus['target'])) {
$menu['target'] = '';
}
if (!isset($menu['icon'])) {
$menu['icon'] = '';
}
$output .= "d.add({$menu['menu_id']}, {$menu['parent_id']}, \"{$menu['name']}\", \"{$menu['url']}\", \"{$menu['title']}\", '{$menu['target']}', '{$menu['icon']}', '{$menu['iconOpen']}');\n";
} else {
if (!isset($menu['url'])) {
$menu['url'] = '';
}
if (!isset($menu['title'])) {
$menu['title'] = '';
}
if (!isset($menus['target'])) {
$menu['target'] = '';
}
if (!isset($menu['icon'])) {
$menu['icon'] = '';
}
if (!isset($menu['iconOpen'])) {
$menu['iconOpen'] = '';
}
$output .= "d.add({$menu['menu_id']}, {$menu['parent_id']}, \"{$menu['name']}\", \"{$menu['url']}\", \"{$menu['title']}\", '{$menu['target']}', '{$menu['icon']}', '{$menu['iconOpen']}', '{$menu['open']}');\n";
}
}
}
}
}
}
}
// 创建菜单树
$output .= "\ndocument.write(d);\n\n";
$output .= "//-->\n";
$output .= "</script>\n";
$output .= "</div>\n";
return $output;
}
?>
  效果图:
DSC0000.png

  参数说明及使用方法如下:

/**
* menu -- dTree 树形菜单函数
*
* @param array $menus  // 菜单数据(数组)
*                 菜单数据样板:
*                 $menus = array(
*                         array('menu_id' => 0, 'parent_id' => -1, 'name' => '首页'),
*                        array('menu_id' => 1, 'parent_id' => 0, 'name' => 'Node 1'),
*                        array('menu_id' => 2, 'parent_id' => 0, 'name' => 'Node 2', 'url' => 'example01.html'),
*                        array('menu_id' => 3, 'parent_id' => 1, 'name' => 'Node 1.1'),
*                        array('menu_id' => 4, 'parent_id' => 0, 'name' => 'Node 3', 'url' => 'example01.html'),
*                        array('menu_id' => 5, 'parent_id' => 3, 'name' => 'Node 1.1.1'),
*                         array('menu_id' => 6, 'parent_id' => 5, 'name' => 'Node 1.1.1.1', 'url' => 'example01.html'),
*                        array('menu_id' => 7, 'parent_id' => 0, 'name' => 'Node 4', 'url' => 'example01.html'),
*                        array('menu_id' => 8, 'parent_id' => 1, 'name' => 'Node 1.2', 'url' => 'example01.html'),
*                        array('menu_id' => 9, 'parent_id' => 0, 'name' => 'My Pictures', 'title' => 'Pictures I\'ve taken over the years','','','img/imgfolder.gif'),
*                        array('menu_id' => 10, 'parent_id' => 9, 'name' => 'The trip to Iceland', 'url' => 'example01.html', 'title' => 'Pictures of Gullfoss and Geysir'),
*                        array('menu_id' => 11, 'parent_id' => 9, 'name' => 'Mom\'s birthday', 'url' => 'example01.html'),
*                        array('menu_id' => 12, 'parent_id' => 0, 'name' => 'Recycle Bin', 'url' => 'example01.html', 'icon' => 'img/trash.gif'),
*                );
*                 menu_id: 表示当前节点的ID
*                parent_id: 表示当前节点的父节点的ID,根节点的值为 -1
*                name: 节点要显示的文字
*                url: 节点的Url
*                title: 鼠标移至该节点时节点的提示文本
*                target: 点击节点时,在目标窗口打开链接,可以是 _blank,_parent,_self,_top,甚至 mainFrame
*                icon: 用做节点关闭时的图标,节点没有指定图标时使用默认值
*                iconOpen: 用做节点打开时的图标,节点没有指定图标时使用默认值
*                open: 节点的默认打开状态,true打开,false关闭(不过它会读cookie, 所以有时看不出效果)
*                 说明: menu_id、parent_id、name 三个参数为必需,不能忽略
*
* @param array $confOpts   // dTree 配置选项参数(数组)
*                 $opts = array(
*                         'target' => 'true'|string,    // 指定所有节点在新窗口中打开链接,默认为 true
*                         'folderLinks' => 'true',      // 文件夹可链接,默认为 true
*                         'useSelection' => 'true',     // 节点被选择时高亮显示,默认为 true
*                         'useCookies' => 'true',       // 用Cookies保存树的当前状态,默认为 true
*                         'useLines' => 'true',         // 创建带线的树,默认为 true
*                         'useIcons' => 'true',         // 创建带有图标的树,默认为 true
*                         'iconPath' => ''                          // 设置图标路径,默认为空        
*                         'useStatusText' => 'false',   // 在底部的状态栏中显示节点名还是显示节点的url,默认为 false
*                        'closeSameLevel' => 'false',  // 同级节点树只能展开一个,默认为 false
*                         'inOrder' => 'false',         // 如果父级节点总是添加在子级节点之前,使用这个参数可以加速菜单显示,默认为 false
*                );
*
* @return JavaScript 脚本代码
*
* 使用方法:
*
* 1、在网页模版的<head></head>中插入下面代码:
*
* <head>
*  <link rel="StyleSheet" href="dtree.css" type="text/css" />
*    <script type="text/javascript" src="dtree.js"></script>
* </head>
*
* 2、在<body></body>中要显示菜单的地方,加入下面代码:
*
* <body>
*   <?php
*     require('dtreemenu.php');
*        $menus = array( ... );
*     $opts = array( ... );
*     echo menu($menus, $opts);
*   ?>
* </body>
*
* @update:2009/09/6
* @author hegz
*
*/
 

运维网声明 1、欢迎大家加入本站运维交流群:群②:261659950 群⑤:202807635 群⑦870801961 群⑧679858003
2、本站所有主题由该帖子作者发表,该帖子作者与运维网享有帖子相关版权
3、所有作品的著作权均归原作者享有,请您和我们一样尊重他人的著作权等合法权益。如果您对作品感到满意,请购买正版
4、禁止制作、复制、发布和传播具有反动、淫秽、色情、暴力、凶杀等内容的信息,一经发现立即删除。若您因此触犯法律,一切后果自负,我们对此不承担任何责任
5、所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其内容的准确性、可靠性、正当性、安全性、合法性等负责,亦不承担任何法律责任
6、所有作品仅供您个人学习、研究或欣赏,不得用于商业或者其他用途,否则,一切后果均由您自己承担,我们对此不承担任何法律责任
7、如涉及侵犯版权等问题,请您及时通知我们,我们将立即采取措施予以解决
8、联系人Email:admin@iyunv.com 网址:www.yunweiku.com

所有资源均系网友上传或者通过网络收集,我们仅提供一个展示、介绍、观摩学习的平台,我们不对其承担任何法律责任,如涉及侵犯版权等问题,请您及时通知我们,我们将立即处理,联系人Email:kefu@iyunv.com,QQ:1061981298 本贴地址:https://www.yunweiku.com/thread-362887-1-1.html 上篇帖子: php彻底杜绝warning: Cannot add header information 下篇帖子: php socket GET POST提交方法(HttpClient) 框架
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

扫码加入运维网微信交流群X

扫码加入运维网微信交流群

扫描二维码加入运维网微信交流群,最新一手资源尽在官方微信交流群!快快加入我们吧...

扫描微信二维码查看详情

客服E-mail:kefu@iyunv.com 客服QQ:1061981298


QQ群⑦:运维网交流群⑦ QQ群⑧:运维网交流群⑧ k8s群:运维网kubernetes交流群


提醒:禁止发布任何违反国家法律、法规的言论与图片等内容;本站内容均来自个人观点与网络等信息,非本站认同之观点.


本站大部分资源是网友从网上搜集分享而来,其版权均归原作者及其网站所有,我们尊重他人的合法权益,如有内容侵犯您的合法权益,请及时与我们联系进行核实删除!



合作伙伴: 青云cloud

快速回复 返回顶部 返回列表