摘要：
使用zTree的官方演示网站：http://www.treejs.cn/v3/main.php#_zTreeInfodemo地址：https://github.com/zhaobao1830/zTreedemo项目1.1中使用的一些方法//获取树对象2varzTree=$。fn。zTree。getZTreeObj（“treeDemo”）；3//获取根节点的数量。getNodes获取根节点
使用zTree的一个demo
官网：http://www.treejs.cn/v3/main.php#_zTreeInfo
demo地址：https://github.com/zhaobao1830/zTreedemo
项目中用到的一些方法
1、
1 //获得树形图对象 2 var zTree = $.fn.zTree.getZTreeObj("treeDemo"); 3 //获取根节点个数,getNodes获取的是根节点的集合 4 var nodeList = zTree.getNodes(); 5 //展开第一个根节点 6 zTree.expandNode(nodeList[0], true);
2、
1 // 通过tId获取到这个节点 2 var node = zTree.getNodeByTId(nodeList_0_tId); 3 console.log(node) 4 // 通过ID获取节点 5 var node1 = zTree.getNodeByParam("id", 2, null); 6 console.log(node1) 7 // 这种指定节点的样式，要用到updateNode 8 zTree.setting.view.fontCss["color"] = '#3aa8e8' 9 zTree.updateNode(node);
3、修改指定节点的样式
现在setting里的view设定fontCss,指定一个方法getFont
1 var setting = { 2 view: { 3 fontCss: getFont, 4 selectedMulti: false, // 是否允许同时选中多个节点 5 addHoverDom:addHoverDom, // 鼠标移动到节点触发的事件 6 removeHoverDom:removeHoverDom // 鼠标移开节点触发的事件 7 },
getFont
1 // @method 设置节点样式，必须用这个方法（这是zTree插件必须的） 2 // @ params node 当前节点 3 function getFont(treeId, node) { 4 return node.font ? node.font : {}; 5 }
设置样式的代码
1 // 通过ID获取节点 2 var node1_new_click = zTree.getNodeByParam("id", treeNode.id, null); 3 4 // 这种指定节点的样式，要用到updateNode 5 node1_new_click.font = {'color': '#3aa8e8'} 6 zTree.updateNode(node1_new_click);
这样就可以设置指定节点的样式了
4、拖拽
http://www.treejs.cn/v3/demo.php#_511
5、选择的时候，改为单选
chkStyle: "radio", // 选择框为单选
radioType: "all" // 在整棵树范围内当做一个分组