好资源导航 » 文章资讯 » 基于zTree树形菜单的使用实例

基于zTree树形菜单的使用实例

2023-09-18 20:56:05 56

在每个节点添加id和pid，id表示当前节点编号，pid表示父节点编号

第一步：在页面显示菜单位置，添加ul设置class=”ztree”

第二步：开启简单数据格式支持

第三步：编写树形菜单数据

第四步：生成树形菜单





ztree树形菜单的使用











//页面加载后执行
$(function(){
//1.进行ztree树形菜单设置，开启简单json数据支持
varsetting={
data:{
simpleData:{
enable:true//开启简单json数据格式支持
}
}
};
//2.提供ztree树形菜单数据
varzNodes=[
{id:1,pId:0,name:"父节点一"},
{id:2,pId:0,name:"父节点二"},
{id:11,pId:1,name:"子节点一"},
{id:12,pId:1,name:"子节点二"},
{id:13,pId:2,name:"子节点三"},
{id:14,pId:2,name:"子节点四"}
];
//3.生成树形菜单
$.fn.zTree.init($("#baseMenu"),setting,zNodes);
});

你我他学习吧

选项卡面板一选项卡面板二

以上这篇基于zTree树形菜单的使用实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。

返回顶部
514930285
czq8825@qq.com

基于zTree树形菜单的使用实例

热门推荐

随机推荐