dTree是一個易於使用的JavaScript樹形菜單控件
支持無限分級,可以在同一個頁面中放置多個dTree,可以爲每個節點指定不同的圖標。
使用方式:
引入dtree.css樣式
引入dtree.js腳本文件
<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>
參數介紹:
名字 | 類型 | 描述 |
id | Number | 唯一的ID號 |
pid | Number | 判定父節點的數字,根節點的值爲 -1 |
name | String | 節點的文本標籤 |
url | String | 節點的Url |
title | String | 節點的Title |
target | String | 節點的target |
icon | String | 用做節點的圖標,節點沒有指定圖標時使用默認值 |
iconOpen | String | 用做節點打開的圖標,節點沒有指定圖標時使用默認值 |
open | Boolean | 判斷節點是否打開 |