步骤1:官网下载dtree.zip包,官网地址:http://destroydrop.com/javascripts/tree/,文件包括dtree.css,dtree.js和api.html和例子;

步骤2:根据example01.html代码修改自己需要的菜单,示例代码如下:

<span style="font-size:14px;"><span style="white-space: pre;">	</span><script type="text/javascript">
<!-- d = new dTree('d'); d.add(0,-1,'My example tree');
d.add(1,0,'Node 1','example01.html');
d.add(2,0,'Node 2','example01.html');
d.add(3,1,'Node 1.1','example01.html');
d.add(4,0,'Node 3','example01.html');
d.add(5,3,'Node 1.1.1','example01.html');
d.add(6,5,'Node 1.1.1.1','example01.html');
d.add(7,0,'Node 4','example01.html');
d.add(8,1,'Node 1.2','example01.html');
d.add(9,0,'My Pictures','example01.html','Pictures I\'ve taken over the years','','','img/imgfolder.gif');
d.add(10,9,'The trip to Iceland','example01.html','Pictures of Gullfoss and Geysir');
d.add(11,9,'Mom\'s birthday','example01.html');
d.add(12,0,'Recycle Bin','example01.html','','','img/trash.gif'); document.write(d); //-->
</script></span>

步骤3:运行效果图如下:

步骤4:要修改或添加图标,可以修改dtree.js代码,如下这段就是图标设置。

	this.icon = {

		root				: 'img/base.gif',

		folder			: 'img/folder.gif',

		folderOpen	: 'img/folderopen.gif',

		node				: 'img/page.gif',

		empty				: 'img/empty.gif',

		line				: 'img/line.gif',

		join				: 'img/join.gif',

		joinBottom	: 'img/joinbottom.gif',

		plus				: 'img/plus.gif',

		plusBottom	: 'img/plusbottom.gif',

		minus				: 'img/minus.gif',

		minusBottom	: 'img/minusbottom.gif',

		nlPlus			: 'img/nolines_plus.gif',

		nlMinus			: 'img/nolines_minus.gif'

	};

注意:树形结构根节点的父id必须为-1,如果要设置其他值请修改dtree.js。

dtree加载菜单基本使用方法的更多相关文章

  1. [Q]手动加载菜单方法

    一般情况下,安装程序会自动安装依云软件菜单,但可能由于某些原因未能自动安装的话,您可以手动加载菜单,步骤如下: 在AoutCAD命令行输入"CUILOAD",会弹出"加载 ...

  2. C#遍历XML文件动态加载菜单

    通过遍历XML文件动态加载菜单,顺便利用WebBrowser控件实现一个简单的桌面浏览器 效果如下: 代码如下: XMLFile1.xml <?xml version="1.0&quo ...

  3. 实战android菜单项之XML加载菜单与动态菜单项[转]

    原文地址:http://blog.csdn.net/kaiwii/article/details/7767225 自定义android应用程序的菜单项首先要知道切入点.经过学习,知道主要是两个Acti ...

  4. Vue + Element UI 实现权限管理系统 前端篇(十):动态加载菜单

    动态加载菜单 之前我们的导航树都是写死在页面里的,而实际应用中是需要从后台服务器获取菜单数据之后动态生成的. 我们在这里就用上一篇准备好的数据格式Mock出模拟数据,然后动态生成我们的导航菜单. 接口 ...

  5. Vue + Element UI 实现权限管理系统(动态加载菜单)

    动态加载菜单 之前我们的导航树都是写死在页面里的,而实际应用中是需要从后台服务器获取菜单数据之后动态生成的. 我们在这里就用上一篇准备好的数据格式Mock出模拟数据,然后动态生成我们的导航菜单. 接口 ...

  6. 在mvc中动态加载菜单

    最近做了一个项目, 要在客户端动态的显示菜单,也就是这些菜单是保存在数据库中的, 在客户端动态加载菜单,这样做的好处很明显,就是菜单很容易修改,直接在后台进行维护,再也不会直接在前面的 视图页面中进行 ...

  7. Excel催化剂开源第7波-VSTO开发中Ribbon动态加载菜单

    在VS开发环境中,特别是VSTO的开发,微软已经现成地给开发者准备了设计器模式的功能区开发,相对传统的VBA.ExcelDna和其他方式的COM加载项开发来说,不需要手写xml功能区,直接类似拖拉窗体 ...

  8. c#动态加载卸载DLL的方法

    这篇文章介绍了c#动态加载卸载DLL的方法,有需要的朋友可以参考一下 c#中通过反射可以方便的动态加载dll程序集,但是如果你需要对dll进行更新,却发现.net类库没有提供卸载dll程序集的方法.在 ...

  9. WEB启动时就加载servlet的dopost方法

    web启动的时候可以加载servlet的init方法,无法加载dopost方法,如果你需要什么内容在启动的时候执行,可以将内容放到init方法里面,dopost方法,是在客户端使用post请求的时候才 ...

随机推荐

  1. MySQL空洞问题解决

    原因:Mysql对于BLOB/TEXT值在执行大量删除操作时可能会引起空洞.空洞就是数据虽然删除了,但是依然占用服务器物理空间,会导致性能底下. 解决办法:定期使用OPTIMIZE TABLE进行碎片 ...

  2. linux下的hashpump安装

    hashpump是linux上的一个进行hash长度拓展攻击的工具 安装: git clone https://github.com/bwall/HashPump apt-get install g+ ...

  3. java android环境变量配置

    JAVA_HOME   用于jdk配置D:\Program Files\Java\jdk1.8.0_25 path %JAVA_HOME%\bin;;%JAVA_HOME%\jre\bin;;D:\P ...

  4. JDK11 JAVA11下载安装与快速配置环境变量教程

    https://blog.csdn.net/weixin_40928253/article/details/83590136 1.到Oracle官网下载jdk11,并安装.搜索“jdk",选 ...

  5. RedHat无法使用yum源问题

    RedHat下的yum是需要注册才能使用的 使用的话会提示: [root@test ~]# yum clean all Loaded plugins: product-id, refresh-pack ...

  6. liunx常用命令笔记

    安装软件教程 linux安装java:https://www.cnblogs.com/lamp01/p/8932740.html linux安装mysql:https://www.cnblogs.co ...

  7. windows之anaconda导入torch失败和pip install命令执行read time out

    昨天用jupyter导入torch还好好的呢,今天用就不行了,先是ImportError: DLL load failed: 找不到指定的模块.再是No such comm target regist ...

  8. Reservoir Computing论文学习

    目录 背景: RC优势: 储备池计算主要理论组成: ESNS数学模型 结构表示 状态方程和输出方程 计算过程 储备池的优化 GA:使用进化算法对参数进行优化: 基于随机梯度下降法的储备池参数优化 参考 ...

  9. android新闻项目、饮食助手、下拉刷新、自定义View进度条、ReactNative阅读器等源码

    Android精选源码 Android仿照36Kr官方新闻项目课程源码 一个优雅美观的下拉刷新布局,众多样式可选 安卓版本的VegaScroll滚动布局 android物流详情的弹框 健身饮食记录助手 ...

  10. SQL服务器攻击总结-注入

    查库选择convert(int,db_name())sysobjects 查当前表id,从sysobjects中选择id,xtype ='u'//此处要记录下数据库的id syscolumns查表对应 ...