目录默认打开
- 这种需求是很常见的,页面加载完成后默认打开部分指定的目录
简单数据个数
- 使用open参数,设置为true即可
/**简单数据格式*/ var zNodes =[ { id:1, pId:0, name:"父节点1 - 展开", open:true,url:"jyy"}, { id:11, pId:1, name:"父节点11 - 折叠"}, { id:114, pId:11, name:"叶子节点114"}, { id:12, pId:1, name:"父节点12 - 折叠"}, { id:124, pId:12, name:"叶子节点124"}, { id:13, pId:1, name:"父节点13 - 没有子节点", isParent:true}, { id:2, pId:0, name:"父节点2 - 折叠"}, { id:21, pId:2, name:"父节点21 - 展开", open:true}, { id:211, pId:21, name:"叶子节点211"}, { id:22, pId:2, name:"父节点22 - 折叠"}, { id:224, pId:22, name:"叶子节点224"}, { id:23, pId:2, name:"父节点23 - 折叠"}, { id:234, pId:23, name:"叶子节点234"}, { id:3, pId:0, name:"父节点3 - 没有子节点", isParent:true} ]; $(document).ready(function(){ /**为容器初始化数据*/ $.fn.zTree.init($("#treeDemo"), setting, zNodes); });
标准数据格式
- 同理使用open参数,设置为true即可
[{"name":"3.2","open":true,"children":[{"name":"asm-3.2.jar"},{"name":"asm-3.2.jar.......
单击展开/折叠节点
- zTree 默认不提供单击展开节点的功能,但可以利用 onClick 事件回调函数轻松实现此功能
- 为了避免与双击功能冲突,建议关闭双击展开节点的功能,请设置 setting.view.dblClickExpand = false
$(document).ready(function () { /** dblClickExpand: false 关闭双击展开节点 * callback:{ onClick: onClick }:回调点击事件 * */ var setting = { view: { dblClickExpand: false }, callback: { onClick: onClick } }; $.ajax({ url: "data/fileTree.json", dataType: "JSON", success:function(data){ console.log(data); var zNodes = data; /** */ $.fn.zTree.init($("#treeDemo"), setting, zNodes); }, error:function(data){ console.log(JSON.stringify(data)); } }); /** * 回调方法 * @param e * @param treeId * @param treeNode */ function onClick(e,treeId, treeNode) { /**treeDemo值是容器的id值,不要带#号*/ var zTree = $.fn.zTree.getZTreeObj("treeDemo"); zTree.expandNode(treeNode); } });