本文记录了使用zTree插件控制树节点展开与合并的学习过程，主要介绍了expandAll和expandNode两个方法的用法，并提供了示例代码，展示了通过按钮操作实现树节点的展开与合并效果。
说明
公司使用了zTree插件生成树状数据，之前没有接触过，查资料发现zTree是一个依靠jQuery实现的多功能“树插件”，更多介绍详见：zTree简介，通过官方demo和网上资料进行学习，在这里记录下
正文
本例采用的是简单JSON数据作为节点，简单模式的JSON数据需要使用id/pid表示节点的父子包含关系，id表示该节点的唯一性，pid为该节点的父结点
ex: var nodes = [
{id:1, pId:0, name: "父节点1"},
{id:11, pId:1, name: "子节点1"},
{id:12, pId:1, name: "子节点2"}
];
默认展开的节点，需要设置treeNode.open属性
无子节点的父结点，需要设置treeNode,isParent属性
本例通过参照网上的例子，实现按钮控制节点数的展开与合并，其中主要使用了expandAll(expandFlag)和expandNode (node, expandFlag, sonSign, focus, callbackFlag)方法
简单介绍这两个方法：
expandAll（expandFlag）: 展开/折叠全部节点，通过zTree对象执行此方法
expandFlag是一个Boolean类型的参数，true表示展开全部节点，false表示折叠全部节点
expandNode (node, expandFlag, sonSign, focus, callbackFlag)：展开/折叠指定的结点
node:必须是zTree内部的数据对象，此方法操作的节点
expendFlag:同上，true表示展开节点 false表示折叠节点
sonSign: 一个Boolean类型的参数，true表示全部子孙节点进行与expandFlag相同的操作， false表示只影响此节点，对于其子孙节点无任何影响
focus: 一个Boolean类型的参数，true表示展开/折叠操作后，通过设置焦点保证此焦点进入可视区域内 false表示展开/折叠操作后，不设置任何焦点，省略等同于true
callbackFlag:一个Boolean类型的参数，表示执行此方法时是否触发回调函数，省略等同于false
示例代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" 
最低0.47元/天 解锁文章
扫一扫
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
