js dtree 树控件用法

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/