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天

知道了
澳门足彩 www.505566.cc-广州体彩中心号码| www.797950.com-海南特区彩票| www.879344.com-浙江福利彩票快乐彩| www.977711.com-彩色压印混泥土| www.ep32.com-新华彩app-| www.81958.cc-揭露网络彩票骗局| www.266689.com-新浪竞彩-| www.429158.com-十字彩怎么充值| www.qg88.cc-湖北快三号码分布| www.88mi.cc-镀铝锌彩涂板| www.3652.win-贵州快三基本走势| www.7979.hk-彩色玉米粉怎么清理| www.iu87.com-彩票倍投方案| www.218191.com-广西时时彩开奖网站| www.676076.com-福彩3d一语定胆| www.360212.com-彩票心里学-| www.87we.com-黑彩支付宝充值漏洞| www.5626.bid-宁夏彩票-| www.310887.com-彩票的k线走势原理| www.397214.com-惠民彩票到底是啥| www.511109.com-彩虹周杰伦听后感| www.580004.com-雅彩彩票客户端下载| www.1699.me-彩票中奖所得计算| 全民汇彩票www.52303g.com| www.05658.com-彩经网首页旧版| www.71874.com-永旺彩票网-| www.111022.cc-557彩票平台| www.869376.com-七星彩中几个有奖| www.999024.com-吉林快三豹子| www.lt16.com-好彩1预测-| www.52la.cc-同城体育彩票网站| www.090.cx-博彩类网站源码| www.72690.com-竞彩足彩让胜| www.137665.com-腾讯分分钟彩| www.sb7.cc-快乐彩走势图| www.90lf.com-小米手机的彩蛋| www.321341.com-彩票大乐透开奖| www.5189.top-七彩大图-| www.568469.com-腾讯分分彩遗漏软件| www.509478.com-大中华彩票线路导航| www.se0.cc-重庆时彩稳赚7绝招| www.42kd.com-数字彩票app下载| www.083338.com-江苏彩票网-| www.9518.in-五位数的彩票是哪种| www.052267.com-星光彩票官方网站| www.859963.com-河内时时彩在线计划| www.221311.com-苹果版重庆时时彩| www.861.date-时时彩一星规律| www.390613.com-全彩本子百度云| www.34065.com-网彩怎么盈利的| www.343387.com-代买彩票赚佣金| www.506890.com-体彩玩法大全| www.3kl.com-彩票14-| www.3657.cm-福彩返奖率是多少| www.57610.com-彩八仙时时彩苹果版| www.040837.com-快樂双彩-| www.566683.com-顺发彩票官网| www.640409.com-高兴彩票-| www.703661.com-四川福利彩票机选| www.780289.com-福彩站怎么赚钱| www.849203.com-皇冠足彩官网| www.905342.com-足彩推单是骗局| www.974535.com-彩运来网址-| www.bx41.com-全国快三走势| www.zg03.com-今天三d福利彩票| www.28xd.com-时时彩技巧回血超快| www.673869.com-明清建筑彩绘| www.743763.com-11选5手机购彩网| www.143755.com-乐八彩票靠谱吗| www.371774.com-天下彩票中心开奖| www.479265.com-盈彩在线-app| www.428858.com-彩票大赢家足球比分| www.520344.com-财神2彩票-| www.580890.com-七乐彩旋转矩阵| www.24.com-今日3d彩报-| www.xt18.com-彩票这个东西能买吗| www.27ci.com-中奖足球彩票图| www.396910.com-长沙市体彩中心电话| www.502072.com-093彩票代理| www.566470.com-彩虹6号全体说话| www.625863.com-彩票软件哪个好哪些| www.kx46.com-澳门彩报-| www.35ju.com-周三买什么彩票| www.773214.com-彩票指南正版报纸| www.843062.com-福彩第一期-| www.900288.com-彩票规律计算软件| www.977079.com-河南结婚风俗彩礼| www.409159.com-体彩扑克牌-| www.6me.cc-彩票订单-| www.048477.com-3d水果图彩吧胆码| www.gt40.com-怎么找私彩平台漏洞| www.836511.com-福利彩票0304| www.825196.com-彩熠灯光官网| www.ur74.com-中国快三老快三| www.139198.com-天天彩票助手推荐| www.246395.com-凤彩网3d-| www.296791.com-福彩幸运快三软件| www.360299.com-时时彩包赚法| www.677633.cc-福彩22选五走图| www.753724.com-有比k彩好的平台吗| www.832654.com-7意彩下载-| www.905693.com-yy彩票揭秘-| www.963845.com-福彩大家乐规则| www.57610.com-彩八仙时时彩苹果版| www.973912.com-福彩种类及玩法| www.tp7.com-快三时时彩是骗局吗| www.z68.win-彩票走势图时时彩| www.069.cm-博彩原理-| www.11968.cc-足球竞彩完场比分| www.99522.cc-哪个软件可以打彩票| www.779947.com-彩票六加一开奖结果| www.966017.com-福彩3d最新开奖| www.cg69.com-江苏快三线上购买| www.4nn.cc-福彩3d彩票交流群| www.858437.com-体彩和值遗漏统计| www.788965.com-古建寺庙彩绘图片| www.947394.com-福彩七加二怎么选| www.nr09.com-福利彩票随机选号码| www.964736.com-澳门足彩即时赔率| www.095432.com-马云以前买过彩票吗| www.85gq.com-什么彩票最赚钱| www.of9.com-快彩在线-| www.32sr.com-穿越福利彩票| www.7181.in-彩宝哪个牌子好| www.389026.com-彩票快三心得体会| www.060741.com-河南福彩网勇士争先| www.938477.com-彩运网平台下载安装| www.cp5034.com-吉林快三技巧顺口溜| www.1663.cc-彩票大师网3d杀码| www.61588.com-天天红单彩票官网| www.021041.com-澳洲三分彩计划网| www.096632.com-福彩公益行-| www.085331.com-玩时时彩心得体会| www.11675.com-彩乐瀑网-| www.460386.com-盛世彩票漏洞| www.9903.online招财猫彩票ios版| www.36500.cc-体育彩票和福彩哪个| www.834810.com-齐鲁福彩三d| www.966335.com-上海福彩80选10| www.zw2.com-河南快三彩票平台| www.3827.xyz-7星彩开奖结果一览| www.382953.com-体彩样票是什么| www.633304.com-买nba总冠军彩票| www.98oq.com-买黑彩票-| www.lh91.com-彩8怎么下载链接| www.36pw.com-七星彩一二差尾振幅| www.181123.com-中彩网首页-| www.28559.com-颜彩-| www.602032.com-买彩票花了十几万| www.232354.com-上海快三三同号预测| www.955376.com-凤凰彩票开挂软件| 818合彩www.www.5666hc.com| www.zs08.com-时时彩害多少人| www.272665.com-彩75-| www.86jn.com-天天彩票网投| www.1862.vip-明天可能中的彩票号| www.9887.cc-爱投彩票系统软件| www.46447.com-时时彩开奖时间更改| www.004385.com-bb3d彩票官网| www.774766.com-体彩刮刮乐新票运| www.846152.com-乐乐彩票可以挣钱| www.935110.com-彩票论坛微信公众号| www.981513.com-全民乐彩票是真的吗| www.fo6.cc-一分钟时时彩骗局|