使用zTree樹不是第一次了 但是 還是翻閱着之前做的 對照着 使用起來比較友善 這裡就把小例子列出來 總結一下使用步驟 這樣友善下次使用起來友善一點
使用zTree樹的步驟:
1.首先 在jsp中引用zTree相關的 CSS檔案和JS檔案
2.其次 在jsp中設定zTree的容器,一般一個<ul id="treeDemo" class="ztree" style="display:none;"></ul>就足夠了 但是必須要設定id,是為了後續的友善使用
3.再者 在js中 配置zTree的setting 配置資訊
4.如果資料是動态的 則将動态擷取到的資料 動态組成ztree的節點
5.初始化 zTree樹
JSP頁面:
View Code
JS代碼:
如果想要更多的效果 例如節點上增删改等 按鈕操作 更多的樣式 更多的事件 就可以檢視zTree的API
界面效果: