文章目录
使用jQuery插件jquery-zTree v3.4
- 在左边模块图片上绑定根菜单元素
- 通过回调函数向后台,发送请求后台根据根菜单数据查询出子菜单元素,
var setting ={
data: {
simpleData: {
enable: true
},
},
callback:{//回调函数
onClick:function(event,treeId,treeNode){
//获取当前节点的数据 treeNode.controller
//修改iframe的src的值
$("#rightMain").prop("src",treeNode.controller);
}
},
async: {
enable: true,//开启异步请求
url: "/systemMenu/loadMenuByParentSn.do",//请求
autoParam: ["sn=parentSn"]//传的参数名字
}
};
- 通过后台返回的数据设置到数组里显示出来
$.fn.zTree.init($(".ztree"), setting,zNodes["business"]);
var zNodes={
business:
{id:1,pId:0,sn:"business",name:"业务模块",isParent:true,open:true},
systemManage:
{id:2,pId:0,sn:"system",name:"系统模块",isParent:true,open:true},
charts:
{id:3,pId:0,sn:"chars",name:"报表模块",isParent:true,open:true}
}