zTree 是一個依靠 jQuery 實現的多功能 “樹外掛”。優異的效能、靈活的配置、多種功能的組合是 zTree 最大優點。

由於剛使用沒多久，並沒有很深入的瞭解zTree，這裡只記錄一下我用到過一些的zTree屬性：

廢話不多說，來實際點的：

zTree的函式:

簡單zTree樹使用方法（步驟）：

<div class="zTreeDemoBackground left">
    <ul id="deptTree" class="ztree"></ul>
</div>

$.fn.zTree.init($("#"+_treeId), setting, _zNodes);
 

常用的setting結構（下面程式碼中帶下劃線的引數都是在setting前面就賦值好的）：

var setting = {
	    data: {
	        simpleData: {
	            enable: true,    //true表示可以接受簡單形式的節點資料,即無序節點,上下級由id和父id控制
	            idKey: _itemId,    //id欄位名
	            pIdKey: _itemPid    //父id欄位名
	        },
	        key: {
	            name: _showField,    //樹節點顯示文字的欄位
	            title: _title    //滑鼠懸浮出現的提示資訊欄位
	        }
	    },
	    async: {
	        enable: _asyn,    //是否開啟非同步載入,true/false
	        dataType: "text",    //非同步載入的返回型別,text可以滿足大部分情況
	        url: jo.getChildUrl,    //查詢子節點的url
	        autoParam: _autoParam,    //自動隨url傳到後臺的引數陣列(key=value形式),用於查詢子節點,只需要指明傳節點的哪個欄位即可(["id","name"]),如果需要自定義key值,例如希望後臺接收到的id值的key為ddid,可以這樣寫:["id=ddid","name"],這樣傳到後臺的就是ddid=幾,而不是id=幾
	        dataFilter: jo.dealChildData    //資料過濾器,即在接收到子節點資料後,展示子節點前,對節點資料的處理
	    },
	    callback: {
	        onClick: _onClickFunc    //單擊的回撥函式
	    },
	    view: {
	        showLine: false    //是否顯示虛線
	    },
	    check: {//需引入cxcheck擴充套件包
	    enable: true,    //勾選框開關
	    chkStyle: "checkbox",    //預設checkbox(與chkboxType屬性關聯),也可以寫radio(與radioType屬性關聯)
	    chkboxType: {"Y":"p","N":"s"},    //Y和N固定不變,Y表示勾選,N表示取消勾選;Y和N的值為p或s或ps,p表示會影響父節點,s表示會影響子節點
	    radioType: "all"    //取值為"all"和"level",all表示在所有節點中單選,level表示在同一層級內單選  
	    }  
};
 

zTree節點資料屬性: