解压缩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. 【Python学习】函数参数传递方法四种(位置,关键字,默认值,包裹位置,包裹关键字传递)

    1. 位置传递: #--coding:utf-8-- def send(name,address): return 'package is sent to %s, located in %s' %(n ...

  2. Tomcat使用,部署

    Tomcat服务器基本使用 web服务软件,也叫web服务器软件,web服务器. 基本使用 1)下载 到apache官网下载. http://www.apache.org 安装版本:window  e ...

  3. oracle 笔试题

    ORACLE笔试题一.单选题1.在Oracle中,以下不属于集合操作符的是( ). A. UNION B. SUM C. MINUS D. INTERSECT2.在Oracle中,执行下面的语句:SE ...

  4. 二十六、Java--------反射

    反射 正常情况下,我们必须知道一个类的完整路径后才可以实例化对象,但是在Java也可以通过一个对象来找到其所在类的信息,这其实就是Class的功能. 可以看到此时的所有操作都是反着来,这就是反射. p ...

  5. hibernate配置文件详细解析

    在javaweb开发中,hibernate框架的是常用的,能帮我们节省大量的时间,以下是hibernate的配置文件解析. hibernate配置文件的默认名为:hibernate.cfg.xml 默 ...

  6. 测试 Prism 语法高亮

    测试 Prism 对 C 语言的语法高亮 #include <stdio.h> #include "math.h" int main(void) { long int ...

  7. springboot 注入Servlet,Filter,Listener的方法

    其实就是注入 FilterRegistrationBean . ServletRegistrationBean . ServletListenerRegistrationBean 这三个类   直接上 ...

  8. Android系统中自定义按键的短按、双击、长按事件

    在项目中碰到这样的问题: 由于系统中的按键在底层做了重新定义或者新增了按键,此时需要在APP层对按键事件(keyevent)做分解处理,模拟Android系统做法,把keyevent分解成: 1.单击 ...

  9. sqlite嵌入式数据库C语言基本操作(1)

    sqlite嵌入式数据库C语言基本操作(1) :first-child{margin-top:0!important}img.plugin{box-shadow:0 1px 3px rgba(0,0, ...

  10. Jquery表单验证

    .代码中添加引用(必备引用) <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript&quo ...