一款很好用的JQuery dtree树状图插件（一）
一款很好用的JQuery?dtree樹狀圖插件
樹狀圖??-dtree由于他的節點設置思想不錯，使連接數據庫的數據庫設計比較方便。
下載dtree資源包，引用一下dtree.css和dtree.js文件，然后編寫節點就行了。
?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>dtreeDemo</title>
<link href="dtree/dtree.css" type=text/css rel=stylesheet>
<script src="dtree/dtree.js" type=text/javascript></script>
</head>
<body>
<p><a href="javascript: d.openAll();">打開全部</a> | <a href="javascript: d.closeAll();">關閉全部</a></p>
<script type="text/javascript">
??
???d = new dTree("d", "img/dtree/");
??
???d.config.useCookies = false;//不使用cookies
???d.config.useStatusText = true; //狀態欄顯示文本
???d.config.closeSameLevel = true; //關閉同一層次其他節點
??
???//root
???d.add(0, -1, "客戶關系管理系統");
??
???//一級導航
???d.add(1, 0, "客戶信息", "", "", "mainFrame");
???d.add(2, 0, "客戶服務", "", "", "mainFrame");
???d.add(3, 0, "日程/任務", "", "", "mainFrame");
???d.add(4, 0, "項目管理", "", "", "mainFrame");
???d.add(5, 0, "系統管理", "", "", "mainFrame");
???d.add(6, 0, "數據字典", "", "", "mainFrame");
???d.add(7, 0, "消息提醒", "", "", "mainFrame");
??
???//二級節點
???d.add(11,1,"客戶");
???d.add(12,1,"聯系人");
??
???d.add(21,2,"客戶投訴");
???d.add(22,2,"投訴報表");
??
???d.add(31,3,"日程");
???d.add(32,3,"任務");
??
???d.add(41,4,"項目立項");
???d.add(42,4,"項目審批");
???d.add(43,4,"項目進程");
???d.add(44,4,"項目總結");
???d.add(45,4,"項目交易");
??
???d.add(51,5,"用戶");
???d.add(52,5,"角色");
??
???d.add(61,6,"企業類型-分類");
???d.add(62,6,"企業性質-類型");
???d.add(63,6,"開戶銀行-分類");
???d.add(64,6,"信息來源-分類");
???d.add(65,6,"客戶滿意度-分類");
???d.add(66,6,"客戶級別-分類");
??
???d.add(71,7,"短消息");
???
???document.write(d);
???//d.add(id,pid,name,url,title,target);
??//id:編號 pid:父節點 name:名稱?url:url地址 title:標題 target:跳轉框架
</script>
</body>
</html>
?
效果圖：
轉載于:https://www.cnblogs.com/bailuobo/p/3967836.html
總結
以上是生活随笔為你收集整理的一款很好用的JQuery dtree树状图插件（一）的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： HDU 3613 Best Reward
- 下一篇： 个人推荐书单