zTree使用方法

本文介绍了如何在页面中使用zTree,包括需要引入的js和css文件,以及zTree的基本配置和数据格式。zTree基于jQuery,创建树形结构时需要设置showLine、checkable和showIcon等属性,并可以通过zTree对象进行后续操作。示例代码展示了数据对象的创建和回调函数的使用。
摘要由CSDN通过智能技术生成

使用zTree树形结构,需要在当前页面中载入zTree的js文件和样式文件

zTree核心js文件:jquery.ztree-2.6.js
在这里插入图片描述
zTree样式文件:
在这里插入图片描述
因为zTree是基于jquery,所以还需要对应的jQuery库文件
在这里插入图片描述
将这些文件引入使用页面:

<script type="text/javascript"

src=“js/jquery-1.4.2.js”>

<script type="text/javascript" src="js/jquery.ztree-2.6.js"></script>

简单使用:

用户需要在页面上新建一个tree对象,需要使用

var
zTree = $("#tree").zTree(setting, zTreeNodes);

$("#tree")是获取页面上一个id为tree的

  • 元素

zTree()方法是加载树形结构,它需要两个参数,一个为setting,zTree 的参数配置数据,json数据格式

另一个为zTreeNodes
,其实这个参数是可选的,因为数据是放在setting对象的root属性下,如果root属性下已经存在数据,则可以不用再加载数据对象,例如异步加载数据后,重新加载树形结构的时候,便不需要再指定数据对象。

zTree
的数据参数,json数据格式

而var zTree 是创建树形结构后返回的一个jQuery对象,之后操作树形结构全部操作这个对象即可。

完整代码为:

<title>这里是测试页面</title>



<link
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值