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.913257.com-广西快三闯关计划| www.127873.com-彩虹的图片照片| www.559605.com-彩宝下载网址多少| www.681597.com-彩票算法统计app| www.mn84.com-时时彩怎么买就稳赢| www.227753.com-众彩彩票app| www.863078.com-查看更多精彩视频| www.944323.com-巨人国际彩票骗局| www.997753.com-8k彩票网-| www.eq20.com-乐彩客app下载| www.xg19.com-永利博彩是真的吗| www.50cl.com-浙江体彩6十丨| www.36581.cc-香港澳门彩票叫什么| www.68155.cc-新彩3d彩票-| www.83901.com-福彩31期结果查询| www.678552.com-成都体彩官网| www.81799.com-网络快三输钱| www.6644.top-彩票中奖500万| www.37981.cc-体彩app购彩厅| www.95792.com-广东公益彩票| www.066197.com-彩吧开机号近10期| www.360793.com-吉林快三半顺走势图| www.508068.com-体彩浙江6十1查询| www.606605.com-买足彩的app澳客| www.306123.com-怎样买世界杯彩票| www.41uy.com-鸿发彩票网没有客服| www.3565.cm-混沌数学与彩票| www.00787.com-有没有彩票平台| www.71699.com-彩71网站-| www.028154.com-福利彩票验票码| www.853614.com-好彩印刷价格表| www.968435.com-福建今天快三开奖| www.nv6.com-甘11选五彩控| www.458467.com-分分彩单双投注技巧| www.548369.com-三分钟快三单双预测| www.199812.com-快三追号倍投计算器| www.286443.com-5分快三破解器视频| www.09ke.com-体彩卩3试机号| www.1282.in-078彩票代理| www.17368.com-彩票平台互刷彩金| www.8686.live-七星体彩中奖号码| www.4136.biz-彩虹六号肝帝版补救| www.08952.com-福彩快3计划怎么出| www.60450.com-彩83官方下载| www.12hp.com-海南七彩票开奖结果| www.96nj.com-排练和彩排的区别| www.811468.com-3d八仙过海牛彩| www.5090.biz-彩票历史大奖| www.253031.com-彩之家官网app| www.647968.com-手机淘宝彩票中心| www.8438.loan-开发彩票网站| www.400074.com-体彩19043-| www.663841.com-乐彩网站怎么样| www.795252.cc-搜索3d彩报| www.01661.com-易彩网双色球杀| www.73876.cc-如何网上买体彩| www.178138.com-手机买彩票怎么买| www.581117.com-大发快三买豹子方法| www.691225.com-易彩国际客服| www.289872.com-彩票是不是骗局| www.518563.com-乐彩网开奖结果查询| www.139150.com-第七感时时彩软件| www.270344.com-17彩票app下载| www.351759.com-彩票输光-| www.447594.com-2019彩票黄历| www.558869.com-购彩彩票手机版| www.772981.com-最新送彩金-| www.435834.com-七星彩局王2018| www.613023.com-彩票系统程序源码| www.ip31.com-新版500万彩票网| www.105068.com-华人彩官方登录| www.55bv.com-福利彩票贵州快3| www.51330.cc-竞彩开奖-| www.666340.com-鑫乐彩彩票-| www.53931.cc-手机在线买彩票| www.125649.com-厦门吕一鸣彩票| www.6590.cm-福彩好运三中奖规则| www.54424.com-优酷彩票是真的吗| www.2489.cm-福彩万能五码| www.9999.red-牛挂彩票-| www.736718.com-上海体彩用户名| www.823211.com-网上的体彩天下快三| www.894772.com-新大陆彩票-| www.954982.com-快三是黑彩不是| 聚彩网www.683505.com| www.3101.vip-最好的彩票必中计划| www.14193.com-快三和值7中奖规则| www.77930.com-以彩开头的四字成语| www.603612.com-v9彩票平台官网| www.756747.com-全民彩是什么| www.831117.com-网易模拟彩票| www.113355.com-靠买彩票能发财吗| www.205563.com-最有实力的私彩平台| www.299610.com-彩8下载app-| www.383028.com-福彩双色球网易杀号| www.509283.com-手机足彩分析软件| www.410606.com-七彩球开奖情况| www.257166.com-彩票开挂app| www.336200.cc-开彩妆加盟店| www.145896.com-金手指预测体彩排三| www.227116.com-彩虹宝宝-| www.747808.com-陕西体彩彩运宝| www.849062.com-快乐彩12选5下载| www.917611.com-旧彩库宝典下载安装| www.980564.com-9968彩票-| www.229002.com-易彩快三中奖规律| www.300713.com-谦喜彩票-| www.357633.com-彩票是内部人中的吗| www.430856.com-江苏彩礼20万| www.512197.com-超真实的彩铅画| www.2400.vip-足球竟彩奖金计算器| www.59407.com-网络彩票开挂| www.641632.com-彩票的纸多大尺寸| www.721671.com-手机彩票软件破解器| www.282668.com-快三三期必中公式| www.457785.com-恒彩88登陆平台| www.660887.com-竞彩肥罗-| www.799925.com-腾讯时时彩计划网页| www.890897.com-快三单式查询| www.971846.com-分分彩挂机平刷方案| www.ay9.cc-五百万彩票网| www.992585.com-猜大小彩票有规律嘛| www.08163.com-体彩排三排五论坛| www.0663.net-福彩30选七-| www.34277.com-七乐彩今日开奖结果| www.101821.com-500万竟彩网| www.247265.com-福彩字谜晚间总汇| www.351108.com-体彩有世界杯彩票吗| www.906193.com-重庆时时彩新规则| www.828176.com-ig传统彩赛车| www.669755.com-卖海南私彩抓吗| www.2112.pw-福利彩票3d42期| www.37gn.com-七星彩最新杀号| www.887249.com-中彩票大奖是否真实| www.070271.com-彩678赚钱吗| www.54jt.com-重庆市福彩发行中心| www.55313.com-时时彩的玩法和规则| www.863136.com-智慧彩挂机方案| www.924540.com-福福彩彩票-| www.992341.com-时时彩四星万能胆| www.jz3.cc-江苏福利彩票官网| www.115.xyz-搜索众达彩票| www.607790.com-湖南排列三彩民论坛| www.730538.com-舟山快2彩票| www.802289.com-精彩视频免费观看| www.882287.com-高频彩种平台哪个好| www.944522.com-手游彩app-| www.982437.com-时时彩五星计划在线| www.il05.com-中国彩票下载安装| www.mt7.cc-内蒙快三玩法介绍| www.455496.com-彩票c16二维码| www.640137.com-遂宁福彩地融资公司| www.772881.com-博胜彩票网投| www.hu40.com-河北彩票快三| www.64rk.com-足彩qq群俱乐部| www.bg76.com-快彩票app-| www.65ux.com-大同彩票合买网站| www.281931.com-双色球今日彩票预测| www.827198.com-500彩网官网| www.978698.com-好彩客在哪可以下载| www.69pq.com-搜狗彩票下载安装| www.381150.com-聚亿购彩时时彩| www.578972.com-宜兴彩票店-| www.705968.com-时时彩龙虎计划软件|