当前位置：
首页 >
Dtree【树形下拉框】
发布时间：2025/5/22
55
豆豆
生活随笔
收集整理的这篇文章主要介绍了
Dtree【树形下拉框】
小编觉得挺不错的,现在分享给大家,帮大家做个参考.
1、从网上下载dtree控件. 2、在Jbuilder中新建Web应用，命名为TreeLearing 3、解压缩dtree.rar包。 把dtree目录拷贝至TreeLearing应用中。 dtree目录下包括这些文件：example01.html 、 dtree.js 、 api.html 、 dtree.css 和img目录 注意：除了api.html之外，其它的文件都是必须拷贝的。只有这个api.html是对dtree控件的函数介绍。 4、复制example01.html，并把粘贴后的文件重命名为Tree.jsp 注意dtree目录下的文件结构不要改变，否则树就不会正常显示 5、在Web应用中指定首页为Tree.jsp页面。 6、Tree.jsp中的代码如下： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head>
<title>Destroydrop » Javascripts » Tree</title> <link rel="StyleSheet" href="dtree.css" type="text/css" />
<script type="text/javascript" src="dtree.js"></script> </head> <body> <h1><a href="/">Destroydrop</a> » <a href="/javascripts/">Javascripts</a> » <a href="/javascripts/tree/">Tree</a></h1> <h2>Example</h2> <div class="dtree"> <p><a href="javascript: d.openAll();">open all</a> | <a href="javascript: d.closeAll();">close all</a></p> <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> </div> <p><a href="mailto:drop@destroydrop.com">©2002-2003 Geir Landrö</a></p> </body> </html> 7、删除紫红色部分的代码，因为不需要哦。 8、注意看绿色和蓝色部分的代码，这才是真正为树添加节点的部分。 d.add(0,-1,'My example tree');
这一句为树添加了一个根节点，显示名称为'My example tree' d.add(1,0,'Node 1','example01.html');
这一句在树的根节点下面添加了一个子节点。（d.add（）方法的参数具体含义可参见api.html文件） 常用的： 第一个参数，表示当前节点的ID 第二个参数，表示当前节点的父节点的ID 第三个参数，节点要显示的文字 第四个参数，点击该节点的超链接（注意也可以是某个servlet或是struts应用中的某个.do请求） 第五个参数，鼠标移至该节点时显示的文字 第六个参数，指定点击该节点时在哪个桢中打开超链接
<title>Destroydrop » Javascripts » Tree</title> <link rel="StyleSheet" href="dtree.css" type="text/css" />
<script type="text/javascript" src="dtree.js"></script> </head> <body> <h1><a href="/">Destroydrop</a> » <a href="/javascripts/">Javascripts</a> » <a href="/javascripts/tree/">Tree</a></h1> <h2>Example</h2> <div class="dtree"> <p><a href="javascript: d.openAll();">open all</a> | <a href="javascript: d.closeAll();">close all</a></p> <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> </div> <p><a href="mailto:drop@destroydrop.com">©2002-2003 Geir Landrö</a></p> </body> </html> 7、删除紫红色部分的代码，因为不需要哦。 8、注意看绿色和蓝色部分的代码，这才是真正为树添加节点的部分。 d.add(0,-1,'My example tree');
这一句为树添加了一个根节点，显示名称为'My example tree' d.add(1,0,'Node 1','example01.html');
这一句在树的根节点下面添加了一个子节点。（d.add（）方法的参数具体含义可参见api.html文件） 常用的： 第一个参数，表示当前节点的ID 第二个参数，表示当前节点的父节点的ID 第三个参数，节点要显示的文字 第四个参数，点击该节点的超链接（注意也可以是某个servlet或是struts应用中的某个.do请求） 第五个参数，鼠标移至该节点时显示的文字 第六个参数，指定点击该节点时在哪个桢中打开超链接
转载于:https://www.cnblogs.com/LeeYan/archive/2009/01/12/1374102.html
总结
以上是生活随笔为你收集整理的Dtree【树形下拉框】的全部内容，希望文章能够帮你解决所遇到的问题。
- 上一篇： [转]Linux系统中用户帐户清洁与安全
- 下一篇： 密码强弱度检测万能插件