解压缩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. Art-template模板

    1.介绍 新一代 javascript 模板引擎. 2.性能(引) 1.性能卓越,执行速度通常是 Mustache 与 tmpl 的 20 多倍(性能测试) 2.支持运行时调试,可精确定位异常模板所在 ...

  2. [转] vim自定义配置 和 在ubnetu中安装vim

    Ubuntu 12.04安装vim和配置   问题: ubuntu默认没有安装vim,出现: jyg@ubuntu:~$ vim test.cThe program 'vim' can be foun ...

  3. C++之路进阶——codevs2306(晨跑)

    2306 晨跑 2009年省队选拔赛山东  时间限制: 1 s  空间限制: 256000 KB  题目等级 : 大师 Master       题目描述 Description Elaxia最近迷恋 ...

  4. paper 116:自然图像抠图/视频抠像技术梳理(image matting, video matting)

    1. Bayesian Matting, Chuang, CVPR 2001.http://grail.cs.washington.edu/projects/digital-matting/paper ...

  5. url编码

    url编码 情况1:网址路径中包含汉字 打开IE,输入网址”http://zh.wikipedia.org/wiki/春节”.注意,”春节”这两个字此时是网址路径的一部分. 查看HTTP请求的头信息, ...

  6. Thinkphp:有你真好

    ThinkPHP是为了简化企业级应用开发和敏捷WEB应用开发而诞生的.最早诞生于2006年初,2007年元旦正式更名为ThinkPHP,并且遵循Apache2开源协议发布.ThinkPHP从诞生以来一 ...

  7. angularJS——ng-bind指令与插值的区别

    在AngularJS中显示模型中的数据有两种方式: 一种是使用花括号插值的方式: <p>{{text}}</p> 另一种是使用基于属性的指令,叫做ng-bind: <p ...

  8. Codefroces 750D:New Year and Fireworks(BFS)

    http://codeforces.com/contest/750/problem/D 题意:烟花会绽放n次,每次会向前推进t[i]格,每次绽放会向左右45°绽放,问有烟花的格子数. 思路:n = 3 ...

  9. python :添加的内容具有之前的功能用delegate绑定事件

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  10. mybatis使用generator生成对应的model、mapping配置文件、dao

    http://blog.csdn.net/fengshizty/article/details/43086833 使用时 补充 输入命令:cd d:\generator  敲回车 再输入命令:d: 敲 ...