jstree使用示例

$(function() {
	  $('#container')
	  .jstree({
	    'core' : { 
	      'check_callback' : true,
	      'themes' : { "dots" : false,"stripes" : true },
	      'data' : [
	                <volist name="jsoninfo" id="vo">//thinkphp 的遍歷標籤
                   	{ "id" : "<{$vo.did}>", "parent" : "<{$vo.parentid}>", "text" : "<{$vo.name}>","icon" : "glyphicon glyphicon-folder-close","state" : { "opened" : true } },
                   	</volist>
                 ]
	    },

<span style="white-space:pre">		</span>//右鍵菜單
		'contextmenu':{
			'select_node':!1,
			'items':function(){
				var a=$.jstree.defaults.contextmenu.items();
				return a.create.label="添加子部門",
				a.create.action=function(a){
					var c=$.jstree.reference(a.reference),
					d=c.get_node(a.reference);
					c.create_node(d,{
						type:"default",
						text:"新建部門"
					},
					"last",
					function(a){
						setTimeout(function(){
							c.edit(a)
						}, 0);
					})
				},
				a.rename.label="重命名",
				a.remove.label="刪除",
				delete a.ccp,
				a
			}
		},
	  	"plugins" : ["wholerow","contextmenu"]
	  })
	  .on('create_node.jstree', function(e, data){ //新建節點
		  //data.node.parent;父節點

		}).on('rename_node.jstree', function(e, data){ <span style="font-family: Arial, Helvetica, sans-serif;">//重命名節點</span>
<span style="white-space:pre">			</span>//處理data.text，data.node.id

		}).on('delete_node.jstree', function(e, data){//刪除節點
			//處理data.node.id
		})
  	  .on("changed.jstree", function (e, data) {
		if(data.selected.length) {
			//獲取點擊焦點是處理data.instance.get_node(data.selected[0]).id
		}
	  });
	  
	});