QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 导航菜单 > jQuery动态获取json树形菜单

jQuery动态获取json树形菜单

jQuery通过ajax调用方法异步获取json数据内容,可自定义编辑添加多级树形菜单内容代码。
分享到微信朋友圈
X

使用方法:


由于树形菜单数据量比较大的时候,我们通过预加载数据的方式生成菜单可能对前后端交互延迟较长。所以研究了下可以预加载也可以异步加载数据的树形菜单插件。

1、这里介绍几种调用方法:

//预加载数据格式
var arr = [{
		id: 1,
		name: "一级",
		open: true,
		child: [
			{
				id: 5,
				name: "二级",
				type:'leaf'
			},
			{
				id: 6,
				name: "二级",
				child: [
				{
					id: 7,
					name: "三级",
					type:'leaf'
				},
				{
					id: 9,
					name: "三级",
					child: [
					{
						id: 10,
						name: "四级",
						child: [
						{
							id: 11,
							name: "五级",
							type:'leaf'
						},
						{
							id: 12,
							name: "五级",
							type:'leaf'
						}
					]}
				]}
			]}]
	}, {
		id: 2,
		name: "一级",
		child: [
			{
				id: 3,
				name: "二级",
				pid: 2,
				type:'leaf'
			},
			{
				id: 3,
				name: "二级",
				pid: 2,
				type:'leaf'
			},{
				id: 4,
				name: "二级",
				pid: 2,
				type:'leaf'
			}
		]
	},{
		id: 8,
		name: "一级",
		pid: 0,
		type:'leaf'
	}
];

//无限级菜单生成
$("#toUl").LuTree({
	arr: arr,
	sign:true,
	simIcon: "fa fa-file-o",//叶子图标
	mouIconOpen: " fa fa-folder-open",//展开图标
	mouIconClose:"fa fa-folder",//关闭图标
	callback: function(id) {
		console.log("你选择的id是" + id);
	}
});

//无限级请求节点下的菜单
$("#ajaxUl").LuAjaxTree({
	url:'./data.json',
	simIcon: "fa fa-file-o",//叶子图标
	Demo:true,//模式,是否在服务器环境,true是演示模式,不需要后台,false是需要后台配合的使用模式
	Method: "POST",//请求方法
	mouIconOpen: " fa fa-folder-open",//展开图标
	mouIconClose:"fa fa-folder",//关闭图标
	callback: function(id) {
		console.log("你选择的id是" + id);
	}
});

//可操作异步加载数据生成无限级树形菜单
$("#updateUl").LuUpdateTree({
	url:'./data.json',
	simIcon: "fa fa-file-o",//叶子图标
	Demo:true,//模式,是否在服务器环境,true是演示模式,不需要后台,false是需要后台配合的使用模式
	Method: "POST",//请求方法
	mouIconOpen: " fa fa-folder-open",//展开图标
	mouIconClose:"fa fa-folder",//关闭图标
	callback: function(id) {
		console.log("你选择的id是" + id);
	}
});


[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
1分快三 www.6227.wang-彩票9acc-| www.028384.com-博彩王彩票分析| www.057129.com-体育彩票官方网| www.044799.com-七星彩票彩种| www.135245.com-快三玩法规则| www.224450.com-快三333-| www.600358.com-一元彩票投注平台| www.90398.com-真实彩票店二维码| www.994262.com-专业彩票分析大师| www.226493.com-辽宁省福利彩票发行| www.ev87.com-乐彩网论坛-| www.453110.com-足彩销售额-| www.129086.com-彩客网大小分| 爱彩www.014ac.com| www.200061.cc-各种彩票开奖结果| www.715321.com-彩票店国家允许吗| www.820616.com-佩奇彩票app| www.9925.cc-福彩3a解太湖汇总| www.512705.com-大星彩票走势图官网| www.827985.com-彩1彩票苹果| www.85xu.com-亿腾彩票网-| www.942922.com-南宁体彩中心地址| www.gy7.cc-江苏快三多少组号码| www.726267.com-河北省体彩兑奖中心| www.802234.com-电竞有彩票么| www.883589.com-大发乐点快三| www.985186.com-在线买竞彩竞猜软件| www.bh46.cc-易彩买彩票真的吗| www.710215.com-充值8送88彩金| www.68985.cc-盈彩在线是骗钱的| 手机购彩www.sjgc2.com| www.505563.com-体彩飞鱼开奖结果| www.607615.com-快三高手私人群| www.683254.com-破解乐乐彩-| www.783609.com-cc分分彩有问题| www.515165.com-七星彩头尾中三定| www.1857.com-湖北乐彩快三推荐| www.01876.com-南国社区彩票网| 大赢家彩票网www.83033e.com| www.350776.com-体彩挣钱吗-| www.407736.com-七星彩赚钱的多吗| www.124942.com-乐彩网35选7| www.222629.com-最高快三返点邀请码| www.486179.com-重庆体彩官方网站| www.bx62.com-派彩网下载-| www.226111.com-体彩3d结果-| www.952337.com-好彩生肖数字| 博通彩票www.894450.com| www.re71.com-168彩票是真的吗| www.42kv.com-彩管家ios下载| www.188987.com-内蒙古快三玩法规则| www.20169.com-彩软计划-| www.76lh.com-七乐彩销售截止| www.911327.com-民彩网安全吗| www.997514.com-彩乐园免费下载| www.fz41.com-福利彩票发行中心| www.u70.cc-澳门博彩财务| www.51kj.com-种彩那天-| www.1177.site-彩票店开业素材| www.7032.cn-众乐彩网-| www.26895.cc-福彩自助终端微信| www.731012.com-竞彩比分唯彩| www.802454.com-福彩3d开奖记录| www.881335.com-彩票分析师合法吗| www.973952.com-快三怎么计算和值| www.125439.com-快三最新玩法| www.249090.com-彩票庄家会输钱吗| www.729335.com-新浪爱彩机选双色球| www.855836.com-七乐彩单式30选7| www.hj16.cc-竞彩投注技巧| www.zh35.com-云购彩票大发快三| www.631545.com-体育七星彩走势图| www.dd48.com-世界彩票十大巨奖| www.33ba.com-体育彩票足彩预测| www.563983.com-彩票开奖公告双彩论| 天天彩票www.www.66368.com| www.399886.com-南国彩票下载| www.592303.com-怎么样举报22彩票| www.254895.com-秒速时时彩官网平台| www.333717.com-体彩排列3中奖说明| www.401403.com-中国福彩3d进宝图| www.83zz.com-彩富网彩天下| www.500177.cc-怎样销售好彩票| www.33511.com-福彩快三线上投注| www.849309.com-nba竞彩篮球吧| www.90855.com-好彩香烟颜色好抽| www.971142.com-福彩赛车是合法的吗| www.615687.com-体彩是选几个数字| www.752575.com-中国福彩利彩票| www.841217.com-七乐彩加减选号| www.934234.com-最准预测彩票号方法| 6678彩票www.2988cai.com| www.948569.com-内蒙古快三微信群| www.054332.com-广东福利彩票网| www.87394.com-家彩网p3开奖结果| www.916747.com-500彩可靠吗| www.994865.com-重庆实时彩开奖视频| www.ga67.com-酷彩吧官网| www.m60.cn-福彩十选五官网| 8号彩票www.60108j.com| www.u46.org-首页新彩票走势网| www.73ed.com-懂彩帝和懂球帝| www.22240.com-足彩波胆比分技巧| www.94748.com-360足球彩票网| www.502787.com-多彩投和开始吧| www.586508.com-立彩彩票邀请码| www.867992.com-福星彩库-| www.519799.com-百度分分彩-| www.246870.com-上海中国体育彩票| www.289572.com-福利彩票主任被查| www.200613.com-够力表七星彩| www.306362.com-335彩票是真的吗| www.376577.com-阿里巴巴博彩| www.385921.com-幸运快三开奖走势图| www.548578.com-铁公鸡七星彩梦奖| www.676903.com-进口彩妆批发| www.760622.com-腾讯时时彩计划稳定| www.826617.com-签到天天送彩金彩票| www.884415.com-福彩三d五行走势图| www.975412.com-福利彩票摇一摇机选| www.gt3.com-北京最新快三玩法| www.28wm.com-星耀彩票-| www.144165.com-彩票实体店营销方案| www.747009.com-购云彩票-| www.838333.com-彩钢瓦屋顶防水价格| www.899831.com-83彩票网-| www.959138.com-快乐十分钟彩票软件| 利彩www.57578d.com| www.892645.com-瑞祥彩云-| www.346669.com-福、彩3d走势图| www.739498.com-快彩违法吗-| www.45641.cc-福彩三d图-| www.048446.com-彩吧p3图谜第四版| www.085555.com-网上买彩票能发财吗| www.4656.vip-买彩票靠运气吗| www.028644.com-福彩山地开奖结果| www.171825.com-黔南州福彩中心| www.070666.com-彩票n-| www.623029.com-福彩3d怏3-| www.610315.com-成都彩钢板厂家| www.08286.com-肉蒙快三走势图| www.cb67.com-天天中奖彩票| www.5635.cn-女网友买彩票骗局| www.zm02.com-南粤风彩好彩1规则| www.41765.com-福彩三地图谜总汇| www.691488.com-彩票系统软件登录| www.818485.com-双色球机选新浪爱彩| www.938623.com-聚福彩票官网| www.997792.com-爱心彩网址-| www.qg77.cc-快三打和值中奖| www.383958.com-订制彩票表格| www.198766.com-三d走势图乐彩网| www.151582.com-官方网时时彩被骗| www.1515.win-福彩体彩双机店转让| www.710698.com-彩钱三条什么意思| www.820959.com-山东彩钢市场| www.891441.com-九彩凤凰图片| www.953426.com-310竞彩足球推荐| 云博彩票www.15199.cc| www.4080.in-荣耀彩票-| www.820089.com-玩彩赚钱是不是真的| www.089770.com-加盟时时彩代理注册| www.753402.com-七星彩开奖结里| www.857123.com-青蛙彩图现场开奖|