<script type="text/javascript" src="../js/ztree/jquery.ztree.all-3.5.js"></script>
<link rel="stylesheet" href="../js/ztree/zTreeStyle.css" />

在所需要的位置設定class="ztree"

<div data-options="title:'基礎選單'">
      <ul id="baseMenu" class="ztree"></ul>
</div>
 

根據需要選擇生成簡單zTree格式還是標準zTree格式(這裡只講簡單)ps:注意要在頁面載入完成後的function裡面寫

var setting = {
   data: {
        simpleData: {
            enable: true //支援json格式
   }
},

編寫樹形選單(簡單和dTree差不多)

var zNodes = [ //駝峰式命名pId
    {id:1,pId:0,name:"父節點1"},			
    {id:2,pId:0,name:"父節點2"},					
    {id:11,pId:1,name:"父1子節點1"},
    {id:12,pId:1,name:"父1子節點2"},
];	
 

生成樹形選單

$.fn.zTree.init($("#baseMenu"), setting, zNodes);