解压缩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的使用的更多相关文章

  1. struts2由&lt;s:tree&gt;要么dtree小工具 建立树

    一个 .<s:tree>方法: 1.引入新的标签: <%@ taglib prefix="sd" uri="/struts-dojo-tags" ...

  2. dtree大型树插件

    一.dtree简介 dtree是一个由JavaScript编写成的简单的树形菜单组件,目前免费并且开源.同时支持动态从数据库引入数据. 二.使用方法 1.下载dtree.js及dtree.css 下载 ...

  3. Tabs - 选项卡插件

        接上篇Tabs  - 选项卡插件  其中12)Yet (E)Another Tab Interface没有依赖任何javascript框架,以作补充          9)Flipping C ...

  4. js 插件使用总结

    1:树形菜单插件: z-tree 和dtree 2: 弹窗插件layer 3: 前端ui框架ace ,  h-ui , layui 4:产品设计图绘制软件Axure和Mockplus(推荐)

  5. 基于jquery下拉列表树插件代码

    分享一款基于jquery下拉列表树插件代码.这是一款实用的jquery 树形下拉框 下拉树代码下载.效果图如下: 在线预览   源码下载 实现的代码. html代码: <table width= ...

  6. dtree的自定义select动作

    项目中用到了dtree,别问我为什么用这么古老的插件,因为简单啊orz,文件树的条目不多,detree加载卡顿的问题也不用解决,开森. 在使用过程中在选择节点后需要自定义一些onclick的动作,本来 ...

  7. DHTMLTree、Dtree和Ztree的学习使用

    一.DHTMLTree是树菜单,允许我们快速开发界面优美,基于Ajax的javascript库.她允许在线编辑,拖拽,三种状态(全选.不选.半选),复选框等模式.同时在加载大数据量的时候,仍然可以保持 ...

  8. JQuery树形插件Dynatree的包装对象

    这是JQuery Dynatree插件的包装对象,做了些改进和增强,增加了右键菜单,以及相应事件等扩展1. [代码]MagicDTree的基本使用 <SCRIPT type=text/javas ...

  9. Angular杂谈系列1-如何在Angular2中使用jQuery及其插件

    jQuery,让我们对dom的操作更加便捷.由于其易用性和可扩展性,jQuer也迅速风靡全球,各种插件也是目不暇接. 我相信很多人并不能直接远离jQuery去做前端,因为它太好用了,我们以前做的东西大 ...

随机推荐

  1. Babel下的ES6兼容性与规范

    前端开发 Babel下的ES6兼容性与规范   ES6标准发布后,前端人员也开发渐渐了解到了es6,但是由于兼容性的问题,仍然没有得到广泛的推广,不过业界也用了一些折中性的方案来解决兼容性和开发体系问 ...

  2. 建模分析之机器学习算法(附python&R代码)

    0序 随着移动互联和大数据的拓展越发觉得算法以及模型在设计和开发中的重要性.不管是现在接触比较多的安全产品还是大互联网公司经常提到的人工智能产品(甚至人类2045的的智能拐点时代).都基于算法及建模来 ...

  3. 卸载Centos自带open-jdk

    1.rpm查看安装文件 rpm -qa|grep java 2,切换到root用户,卸载 rpm -e --nodeps java-1.7.0-openjdk-headless-1.7.0.75-2. ...

  4. 使用C#反射中的MakeGenericType函数,来为泛型方法和泛型类指定(泛型的)类型

    C#反射中的MakeGenericType函数可以用来指定泛型方法和泛型类的具体类型,方法如下面代码所示这里就不多讲了,详情看下面代码一切就清楚了: using System; using Syste ...

  5. java语言的I/O操作预习

    一些概念: 流:计算机的输入输出之间流动的数据序列,也是类的对象.java中的流方式就像是建立在数据交换源和目的之间的一条通信路径. 数据源:计算机中的数据源是指可以提供数据的地方,包括键盘,磁盘文件 ...

  6. SQL SERVER 数据库备份的三种策略及语句

    1.全量数据备份    备份整个数据库,恢复时恢复所有.优点是简单,缺点是数据量太大,非常耗时 全数据库备份因为容易实施,被许多系统优先采用.在一天或一周中预定的时间进行全数据库备份使你不用动什么脑筋 ...

  7. JDK在Linux系统上安装教程

      一.下载jdk相应版本(我用的是jdk-8u111-linux-x64) 下载地址去官网:http://www.oracle.com/technetwork/cn/java/javase/down ...

  8. JS 获取url参数

    <html> <body> 浏览器中输入 http://localhost/test/js_url.php?a1=aaa&a2=bbb&a3=ccc 会依次弹出 ...

  9. 【转】Git图形化界面客户端大汇总

    原文网址:http://my.oschina.net/amstrong/blog/159114 目录[-] 一.TortoiseGit - The coolest Interface to Git V ...

  10. easyui DataGrid 工具类之 TableUtil class

    import java.lang.reflect.InvocationTargetException;import java.util.ArrayList;import java.util.HashM ...