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/