zTree 优秀的jquery树插件,文档详细，渲染快
使用方法：
1、引用zTree的js和css文件
<link href="~/Content/zTree_v3/css/zTreeStyle/zTreeStyle.css" rel="stylesheet" /><script src="~/Content/zTree_v3/js/jquery.ztree.core.min.js"></script><script src="~/Content/zTree_v3/js/jquery.ztree.excheck.min.js"></script><script src="~/Content/zTree_v3/js/jquery.ztree.exedit.min.js"></script>
2、ztree的html为
<ul id="treeInfo" class="ztree"></ul>
需加Class：ztree；
3、初始化树
???????var setting = { ???????????async: { ???????????????enable: true, ???????????????url: "",//后台接口地址 ???????????????autoParam: ["id", "nextType"],//异步加载子节点时自动传入的参数 ???????????????type: "get", ???????????}, ???????????check: { ???????????????enable: true, ???????????????chkStyle: "checkbox", ???????????????chkboxType: { "Y": "", "N": "" } ???????????}, ???????????view: { ???????????????addHoverDom: addHoverDom, ???????????????removeHoverDom: removeHoverDom, ???????????????selectedMulti: false ???????????}, ???????}; ???????$.fn.zTree.init($("#treeCarInfo"), setting); ??后台接口返回数据示例：
4、加入鼠标移动到显示的自定义按钮
function addHoverDom(treeId, treeNode) { ???????????var aObj = $("#" + treeNode.tId + "_a"); ???????????if ($("#callBtn_" + treeNode.id).length > 0) return; ???????????var editStr = "<span id=‘callBtn_space_" + treeNode.id + "‘ > </span>" ???????????????+ "<button type=‘button‘ class=‘btn callbtn‘ ?id=‘callBtn_" + treeNode.id ???????????????+ "‘ title=‘" + treeNode.name + "‘ onfocus=‘this.blur();‘>按钮</button>"; ???????????aObj.append(editStr); ???????????var btn = $("#callBtn_" + treeNode.id); ???????????if (btn) btn.bind("click", function () { ???????????????//按钮点击事件 ???????????}); ???}; ???function removeHoverDom(treeId, treeNode) { ???????$("#callBtn_" + treeNode.id).unbind().remove(); ???????$("#callBtn_space_" + treeNode.id).unbind().remove(); ???}; ???5、文档地址 http://www.treejs.cn/v3/api.php
zTree 优秀的jquery树插件
原文地址：http://www.cnblogs.com/tangchun/p/8081613.html