插件dTree的使用
解压缩dtree.zip 包。
dtree目录下包括这些文件:example01.html 、 dtree.js 、 api.html 、 dtree.css 和img目录
注意:除了api.html之外,其它的文件都是必须拷贝的。api.html是dtree的函数介绍。
打开example01.html文件
<link rel="StyleSheet" href="css/dtree.css" type="text/css" />
<script type="text/javascript" src="js/dtree.js"></script>
必须引用的两个文件。
生成树 节点的代码:
<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>
d.add(0,-1,’My example tree’);
这一句为树添加了一个根节点,显示名称为’My example tree’ d.add(1,0,’Node 1’,’example01.html’);
这一句在树的根节点下面添加了一个子节点。(d.add()方法的参数具体含义可参见api.html文件)
常用的:
第一个参数,表示当前节点的ID
第二个参数,表示当前节点的父节点的ID,根节点的值为 -1
第三个参数,节点要显示的文字
第四个参数,节点的Url
第五个参数,鼠标移至该节点时节点的Title
第六个参数,节点的target
第七个参数,用做节点的图标,节点没有指定图标时使用默认值
第八个参数,用做节点打开的图标,节点没有指定图标时使用默认值
第九个参数,判断节点是否打开
使用实例大家可参照 www.amyou.cn 的树型菜单
附 rlog翻译:
属性菜单使用说明
函数
add()
向树里添加一个节点
只能在树被创建之前调用.
必须 id, pid, name
参数
名字 类型 描述
id Number 唯一的ID号
pid Number 判定父节点的数字,根节点的值为 -1
name String 节点的文本标签
url String 节点的Url
title String 节点的Title
target String 节点的target
icon String 用做节点的图标,节点没有指定图标时使用默认值
iconOpen String 用做节点打开的图标,节点没有指定图标时使用默认值
open Boolean 判断节点是否打开
例子
mytree.add(1, 0, ’My node’, ’node.html’, ’node title’, ’mainframe’, ’img/musicfolder.gif’);
openAll()
打开所有节点
可在树被创建以前或以后调用.
例子
mytree.openAll();
closeAll()
关闭所有节点
可在树被创建以前或以后调用.
例子
mytree.closeAll();
openTo()
Opens the tree to a certain node and can also select the node.
只能在树被创建以后调用..
参数
名字 类型 描述
id Number 节点唯一的ID号
select Boolean 判断节点是否被选择
例子
mytree.openTo(4, true);
配置
变量 类型 默认值 描述
target String true 所有节点的target
folderLinks Boolean true 文件夹可链接
useSelection Boolean true 节点可被选择(高亮)
useCookies Boolean true 树可以使用cookies记住状态
useLines Boolean true 创建带线的树
useIcons Boolean true 创建带有图标的树
useStatusText Boolean false 用节点名替代显示在状态栏的节点url
closeSameLevel Boolean false 只有一个有父级的节点可以被展开,当这个函数可用时openAll() 和 closeAll() 函数将不可用
inOrder Boolean false 如果父级节点总是添加在子级节点之前,使用这个参数可以加速菜单显示.
例子
mytree.config.target = "mytarget";
插件dTree的使用的更多相关文章
- struts2由<s:tree>要么dtree小工具 建立树
一个 .<s:tree>方法: 1.引入新的标签: <%@ taglib prefix="sd" uri="/struts-dojo-tags" ...
- dtree大型树插件
一.dtree简介 dtree是一个由JavaScript编写成的简单的树形菜单组件,目前免费并且开源.同时支持动态从数据库引入数据. 二.使用方法 1.下载dtree.js及dtree.css 下载 ...
- Tabs - 选项卡插件
接上篇Tabs - 选项卡插件 其中12)Yet (E)Another Tab Interface没有依赖任何javascript框架,以作补充 9)Flipping C ...
- js 插件使用总结
1:树形菜单插件: z-tree 和dtree 2: 弹窗插件layer 3: 前端ui框架ace , h-ui , layui 4:产品设计图绘制软件Axure和Mockplus(推荐)
- 基于jquery下拉列表树插件代码
分享一款基于jquery下拉列表树插件代码.这是一款实用的jquery 树形下拉框 下拉树代码下载.效果图如下: 在线预览 源码下载 实现的代码. html代码: <table width= ...
- dtree的自定义select动作
项目中用到了dtree,别问我为什么用这么古老的插件,因为简单啊orz,文件树的条目不多,detree加载卡顿的问题也不用解决,开森. 在使用过程中在选择节点后需要自定义一些onclick的动作,本来 ...
- DHTMLTree、Dtree和Ztree的学习使用
一.DHTMLTree是树菜单,允许我们快速开发界面优美,基于Ajax的javascript库.她允许在线编辑,拖拽,三种状态(全选.不选.半选),复选框等模式.同时在加载大数据量的时候,仍然可以保持 ...
- JQuery树形插件Dynatree的包装对象
这是JQuery Dynatree插件的包装对象,做了些改进和增强,增加了右键菜单,以及相应事件等扩展1. [代码]MagicDTree的基本使用 <SCRIPT type=text/javas ...
- Angular杂谈系列1-如何在Angular2中使用jQuery及其插件
jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...
随机推荐
- web前端基础知识 Dom
文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式.我们最为关心的是,DOM把 ...
- android Dialog重绘
String title = ""; if(itemInfo!=null) title = "\n\""+itemInfo.itemSSID+&quo ...
- 获取设备的mac地址和IP地址(android6.0以上专用)
/** * 获取设备HardwareAddress地址 * @return */public static String getMachineHardwareAddress(){ Enumeratio ...
- 安装hive+mysql
1.源码安装mysql 以root用户首先安装libaio-0.3.104.tar.gz tar zxvf libaio-0.3.104.tar.gz cd libaio-0.3.104 make p ...
- 实测:Windows 8.1 (Windows Blue) 第三方桌面应用无法支持Retina屏,效果与Windows8.0似无差别。
首先我是在VMWARE下装的Windows Blue,是否改用BootCamp直接装就没问题我不知道,理论上应该无差别. 谣言里那个Windows Blue里的缩放功能可以完美支持Retina,但实际 ...
- 基于spring和Quartz定时器
最近做一个小项目,要每7天去调用webservice获取一次数据.所以就用定时器来完成spring是4.1.6,quartz是2.2.1. 首先配置spring的xml文件.首先定义你要被执行的类 & ...
- js获取元素样式
http://blog.sina.com.cn/s/blog_89cd68470101i108.html
- percona server 二进制安装下编译tpcc-mysql的坑
出于习惯,percona server的部署都是通过二进制包自动化安装,结果遇到一个硕大无比的坑,编译TPCC-MySQL时出现警告 10:49:36 root@DB-Master:~/tpcc-my ...
- c# winform DirectX播放器 可以任意设置宽高比 屏幕拉伸
第一步:dll引用 Microsoft.DirectX.dll Microsoft.DirectX.AudioVideoPlayback.dll 如果没有的话,可能需要安装微软的DRECTX JDK ...
- oracle 查询最近执行过的 SQL语句(转载)
oracle 查询最近执行过的 SQL语句 (2014-06-09 18:02:43) 转载▼ 分类: Database oracle 查询最近执行过的 SQL语句 select sql_text ...