js dtree 树控件用法

最新推荐文章于 2021-03-06 10:27:16 发布

原创最新推荐文章于 2021-03-06 10:27:16 发布 · 1.9k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jbuilder #javascript #border #web #css #url

基础（常用函数）以及需要注意的地方专栏收录该内容

31 篇文章

订阅专栏

本文指导如何从网上下载并整合dtree控件到Web应用中，通过新建Web应用、解压和复制相关文件来实现动态树结构，并提供CSS样式定制和首页配置。同时，详细介绍了如何在Web页面上实现JavaScript右键菜单功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

dtree动态树+Javascript右键菜单（一） 1、从网上下载dtree控件。（好多地方都有的哦：P） 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中的代码如下：

说明：这是静态的代码，动态的可用循环加入。三：css文件的注解 1:dtree.css .dtree {//定义目录树节点的字体，字号，颜色 font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 12px; color: #006600; white-space: nowrap; } .dtree img {//定义选用节点图标的样式，位置 border: 0px; vertical-align: middle; } .dtree a {// color: #006600; text-decoration: none; } .dtree a.node, .dtree a.nodeSel { white-space: nowrap; padding: 0px 0px 0px 0px; } .dtree a.node:hover, .dtree a.nodeSel:hover { color: #006600; text-decoration: none; } .dtree a.nodeSel { background-color: #c0d2ec; } .dtree .clip { overflow: hidden; }

下载url：http://www.destroydrop.com/javascripts/tree/