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.a23.pw-彩票兑奖地点及要求| www.550343.com-网易彩票网电脑版| www.949273.com-今日彩票3d图纸| www.222413.com-盈彩网9369cc| www.876786.com-彩票以大博小技巧| www.971779.com-彩票网站名字大全| www.ui1.cc-七乐彩开奖结果今天| www.wf39.com-甘肃快三历史遗漏| www.34mg.com-爱彩新浪比分直播网| www.091733.com-下载环球彩票| www.087022.com-彩票两元走势图| www.031966.com-十一选五彩票能买吗| www.287326.com-万能数字型彩票软件| www.801228.com-6a彩票app-| www.0342.xyz-爱乐透彩票免费下载| www.8367.biz-辣椒够力七星彩表| www.542375.com-双彩网3d图谜专区| www.687602.com-陕西中国福利彩票| www.826401.com-数字彩票下载安装| www.914566.com-如何下载瑞彩网| www.982542.com-福彩头奖兑奖流程| www.oc54.com-内蒙福彩快3中豹子| www.848510.com-两分时时彩开奖结果| www.61327.cc-众彩市场-| www.043772.com-时彩经验-| www.418688.com-福利彩票二十选八| www.558115.com-菲律宾网络博彩| www.629959.com-张路最新足彩推荐| www.516770.com-色彩搭配口诀| www.037628.com-彩票聚财神app| www.118981.com-玩极速快三的技巧| www.193062.com-贵州快三提前预测| www.268661.com-鸿彩网-| www.600588.cc-买彩票买多少注| www.326313.com-网易彩票比分直播| www.089505.com-福彩pk10官网| www.621893.com-秒到彩票-| www.708067.com-竞彩误差计算器| www.802931.com-福彩可以买吗| www.883181.com-36购彩-| www.960323.com-做博彩-| 500万彩票www.98528h.com| 500彩票网www.97655w.com| www.563693.com-大中华彩票官网下载| www.294967.com-中国副利彩票| www.418766.com-洛阳体彩兑奖在哪里| www.717335.com-彩铅怎么画阴影| www.73225.cc-彩票摇一摇选号| 大赢家彩票平台www.376513.com| www.202090.com-手机彩票软件大全| www.676098.com-福利彩票图谜汇总| www.786016.com-今福彩开结果| www.864824.com-彩膜怎么贴-| www.932217.com-时时彩随机开奖原理| www.990586.com-快三彩票是真的| www.cz62.com-香港六合彩| www.567294.com-福彩双色球福票| www.654252.com-南昌福利彩归那里管| www.722343.com-体育彩票飞鱼怎么玩| www.800331.com-网上彩票赚钱真假| www.878351.cc-彩福彩票安全吗| www.963861.com-内蒙古快三今天查询| www.c9.cx-彩票河北快三走势图| www.vo84.com-甘肃快三规律破解| www.080122.com-大发快三出豹子规律| www.537961.com-国彩的项目-| www.677511.com-大亨彩票算号器| www.785505.com-xr有原彩显示吗| www.886403.com-大发彩注册-| www.971447.com-卓易彩票苹果| www.oz37.com-宁夏体彩11迭5| www.28ln.com-三彩代购-| www.25557.com-彩库宝旧版下载安装| www.272332.com-彩70彩票-| 大赢家彩票平台www.710230.com| www.404804.com-6加1彩票规则介绍| www.8688.me-7七星彩开奖结果| www.34oq.com-彩软吧-| www.j91.cn-天天中彩票升级版| www.736909.com-大众彩票网审核| www.288151.com-安徽快三和值遗漏| www.363847.com-江苏快三推二同| www.450002.com-爱米彩-| www.563509.com-d8彩票下载软件| www.377.com-体彩七星彩牛材网| www.6350.org-曲昌春讲故事看竞彩| www.90554.com-富赢彩票下载| www.160168.com-快三之家是不是真的| www.ft78.com-让你做快三兼职| www.201934.com-彩票投注技巧| www.98550.com-九分彩裤-| www.306822.com-天津彩票时时彩中奖| www.3226.xyz-头奖彩票公告暂停| www.568467.com-3d断组预测牛彩网| www.7075.org-江苏快三一天几期| www.33131.cc-易彩快三大小走势图| www.98797.cc-有没有人玩快三发财| www.900984.com-福彩东北彩霸3| www.a92.top-彩博-| www.4666.in-不买彩票还想着中奖| www.199158.com-福利彩票3d开奖| www.635375.com-星光武彩张星彩| www.739059.com-玩彩票用什么软件| www.129786.com-七星彩特区论坛论| www.218.in-官方好运快三| www.208562.com-七星彩票术语大全| www.ne80.com-皇都彩票登录| www.7017.vip-七彩官方网-| www.159140.com-福彩走势图软件下载| www.410381.com-爱尔兰彩票官网| www.1590.org-彩票27亿-| www.892551.com-查七乐彩-| www.962694.com-富贵彩软件-| www.cai2711.com五分快三技巧| www.760616.com-网球去哪里买彩票| www.839655.com-中国彩票要倒闭| www.927256.com-福利彩票最大的数字| www.84oa.com-北京新彩华章| www.4328.biz-章鱼彩票是否合法| www.374588.com-今天篮彩预测推荐| www.oi32.com-江苏体彩ll选5| www.12186.com-体彩双色球-| www.012212.com-七星彩高手交流论坛| www.077308.com-彩色复印机排行| www.21323.cc-农村彩神双色球预测| www.2364.biz-查七星彩-| www.832543.com-七彩云盒app| www.563977.com-人人彩合法吗| www.305161.com-新手怎么买彩票选号| www.393227.com-今日彩票天将结果| www.545660.com-福彩三地丽人杀码| www.674557.cc-亚搏彩票app下载| www.727595.com-杏彩app下载| www.815023.com-腾讯彩票网官方端口| www.986443.com-竞彩蓝球比分计算器| www.qs81.com-彩票到年底-| www.8817.top-福彩3d辅助-| www.73215.com-网上买彩票下载| www.330470.com-体育彩票有哪些数字| www.754408.com-双彩网首页下载| www.925858.com-时时彩开挂-| www.972558.com-彩铅花海-| 大玩家彩票www.84499i.com| www.ff84.com-5000cc彩票-| www.697005.com-分分时时彩在线计划| www.19518.com-中彩网全国走势图表| www.71520.cc-幸运彩02-| www.031171.com-众发彩票计划| www.105572.com-重庆老时时彩下载| www.a04.cc-新浪爱彩合法吗| www.288830.cc-时时彩专业术语讲解| www.142036.com-体彩近十期试机号| www.389096.com-彩发发pk10-| www.877066.com-福彩3d速查表最新| www.947411.com-多彩贵州网公司待遇| 百姓彩票www.www.bxcp3333.com| www.35kd.com-彩491cc-| www.0149.com-色彩颜色-| www.5817.wang-足彩345关怎么算| www.6228.biz-极速赛车彩票手机版| www.800323.com-彩神帝登陆入口| 3G彩票www.3991.cc| www.ou14.com-查河北福彩快3开奖| www.24he.com-金码关注彩宝网|