zTree 如何跟 jquery取得的数据生成树

zTree的jquery树插件就可以生成树了。

1、setting 配置信息说明

普通使用，无必须设置的参数

与显示相关的内容请参考 API 文档中 settingview 内的配置信息

name、children、title 等属性定义更改请参考 API 文档中 settingdatakey 内的配置信息

2、treeNode 节点数据说明

标准的 JSON 数据需要嵌套表示节点的父子包含关系

例如：

var nodes = [

{name: "父节点1", children: [

{name: "子节点1"},

{name: "子节点2"}

]}

];

默认展开的节点，请设置 treeNodeopen 属性

无子节点的父节点，请设置 treeNodeisParent 属性

其他属性说明请参考 API 文档中 "treeNode 节点数据详解"

zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。

zTree 是开源免费的软件（MIT 许可证）。如果您对 zTree 感兴趣或者愿意资助 zTree 继续发展下去，可以进行捐助。

1首先在页面上有<ul/>标签

<ul id="tree" class="ztree"></ul>

2定义ztree的配置参数

var setting = {

//check属性放在data属性之后，复选框不起作用

check: {

enable: true

},

data: {

simpleData: {

enable: true

},

}

};

3获得ztree所要绑定的数据,可以使用静态数据也可以使用ajax获取的数据

a)Ztree的数据有两种格式,标准格式如下:

标准的 JSON 数据需要嵌套表示节点的父子包含关系

例如：

var nodes = [

{

name: "父节点1",

open:true,

children: [

{name: "子节点1"},

{name: "子节点2"}

]

}

];

b)简单数据格式如下(推荐使用):

简单模式的 JSON 数据需要使用 id/pId表示节点的父子包含关系，如使用其他属性设置父子关联关系请参考settingdatasimple内各项说明

例如：

var nodes = [

{id:1, pId:0, name: "父节点1"},

{id:11, pId:1, name: "子节点1"},

{id:12, pId:1, name: "子节点2"}

];

简单数据的id,pId,name,title都可以在setting的data中进行配置,指定相应的字段。

在setting的data中配置simpleData为enable:true即表示使用简单数据格式,不配置或配置为false则为标准数据格式

var setting = {

data: {

simpleData: {

enable: true

}

}

};

4初始化ztree生成树

$fnzTreeinit($("#tree"), setting, nodes);

第一个参数是<ul/>id选择的jquery对象,第二个参数是配置的setting,第三个参数是获取到的数据

以上就是关于zTree 如何跟 jquery取得的数据生成树全部的内容，包括:zTree 如何跟 jquery取得的数据生成树、Ztree中simpleData是怎么转换成标准ztree数组对象的、等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！