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.30tb.com-彩虹下面吉他弹唱| www.654322.com-时时彩牛牛怎么玩| www.095172.com-福彩王素英-| www.185869.com-快三经验-| www.542785.com-公益彩票软件能玩吗| www.858231.com-博彩分红项目靠谱不| www.968782.com-彩票倍投计算公式| www.lu9.cc-天空彩票-| www.222180.com-福彩十分钟开奖结果| www.ty05.com-彩票收米-| www.190722.com-彩票app平台| www.47657.com-大乐透中彩票的概率| www.148120.com-网上购彩违法吗| www.335830.com-快三是不是赌博| www.214968.com-新湖北快三-| www.8567.win-澳客彩票网定胆杀号| www.60165.com-彩名堂苹果手机下载| www.0372.love-谢俊娟花式快三| www.8762.vip-彩票预测分析软件| www.267710.com-中国体彩网官网客服| www.369284.com-鸿鑫福彩-| www.811219.com-福彩3d摇奖现场| www.929693.com-彩8计划助手| 大赢家彩票网www.54400o.com| www.05054.com-爱彩乐开奖号码图表| www.84675.com-时时彩二期必中计划| www.364532.com-彩虹映脸男生头像| www.1708.xyz-彩工网推荐快三| www.8565.net-全国体彩福彩开奖| www.61261.com-时时彩购彩助手| www.506857.com-新梦想彩票-| www.536891.com-好彩票有多少个网址| www.622673.com-福彩3d一点通字谜| www.545096.com-开福彩-| www.31513.cc-玩彩的朋友-| www.533044.com-七星彩什么几点开奖| www.004000.com-海南彩票交流平台| www.301352.com-天天彩票骗局揭秘| www.0473.cn-亚洲彩票提款| www.025533.com-2元彩票网专家杀号| www.739049.com-石家庄体彩中心电话| www.99272.cc-快三心得走势| www.521428.com-南昌市体育彩票网站| www.646739.com-彩民之家036| www.48gv.com-吋时彩今天开奖结果| www.379809.com-腾讯60秒彩的漏洞| www.497733.com-q彩怎么下载安装| www.565211.com-万彩吧3d-| www.637953.com-色彩搭配的方法| www.715078.com-五分彩中奖公式| www.795501.com-新彩票走势图网| www.866296.com-体彩481任选一| www.381841.com-彩亿电商靠谱吗| www.114777.com-中彩娱乐应用下载| www.03700.com-买彩票一定会亏吗| www.77385.com-三四组合中头彩| www.195219.com-彩96app-| www.595594.com-微信新未来彩票| www.442259.com-现在结婚彩礼顺口溜| www.139124.com-彩22官方下载| www.kr88.com-新浪足彩分析| www.89ob.com-沈阳彩票站转让| www.5802.cm-竞彩篮球赛果| www.685169.com-重庆时时彩赌软件| www.184088.com-北京快三开到几点钟| www.356130.com-分分彩提前开奖软件| www.835029.com-好彩香烟哪里有得卖| www.935908.com-快彩是基诺型彩票吗| 彩69www.214656.com| www.75338.cc-上海时时乐彩票介绍| www.55098.com-免费送彩金论坛| www.319982.com-黑彩举报电话是多少| www.428755.com-中国体育彩票体彩| www.523545.com-tt彩票网下载安装| www.601931.com-中国红彩票兑奖| www.674576.com-体彩归民政部吗| www.917018.com-彩票网132-| www.995096.com-新浪彩票数据频道| www.eu34.com-彩神计划破解版| www.xm30.com-福彩三d中奖规则| www.mr6.com-快三预测河南| www.132354.com-河南彩礼立法| www.213889.com-快三分析软件app| www.311299.com-福彩体彩走势图| www.258244.com-江苏快三怎么买| www.325587.com-今日3d彩票谜语| www.385807.com-百度彩票166| www.473898.com-南京福利彩票网点| www.543240.com-481彩票怎么买| www.77821.cc-7乐彩开奖历史| www.383373.com-有选一个号的彩票吗| www.653003.com-高频彩票改20分钟| www.761564.com-福彩三d乐彩网首页| www.846005.com-哪些app能买足彩| www.971993.com-网络统一彩票骗局| www.jd62.com-竞彩足球比分查询| www.134.tv-彩虹彩虹的约定视频| www.662032.com-熊猫彩票能赚钱吗| www.561080.com-久游彩票平台半厘| www.2016.cx-和彩日本料理怎么样| www.701798.com-乐赢彩票邀请码| www.802806.com-体彩历史开奖排列三| www.915899.com-彩票站怎么加盟代理| www.984369.com-呜彩-| www.ey97.com-牛彩票开奖直播现场| www.xh36.com-优乐彩官网登录| www.53tf.com-铜仁市体彩中心| www.1035.live-搜索三b彩票试机号| www.7028.biz-福彩7星彩-| www.41282.com-买彩票诈骗-| www.506573.com-福彩3d杀尾方法| www.357697.com-中彩票20万-| 8号彩票www.60108r.com| www.434988.com-幸运国际时时彩平台| www.80xa.com-农村医药报一新粤彩| www.7927.loan-官方彩是什么情况| www.939175.com-手机足彩比分直播| www.986751.com-竞彩篮球及时比分| www.hh2.com-玩大发快三能赢吗| www.ta91.com-乐盈彩官网-| www.wq97.com-好彩票网站平台| www.44dw.com-福彩3d胆码组合| www.1804.cn-兴盈快三下载| www.021440.com-博亚官方彩票平台| www.8157.wang-彩28彩票平台| www.611080.com-彩38c38net-| www.233254.com-爱彩乐大发-| www.64ef.com-彩王艾先生最后结局| www.872951.com-37彩票-| www.952074.com-北京快三平台下载| www.986255.com-时时彩最聪明的玩法| 500彩票www.904827.com| www.171025.com-贵州快三推荐| www.796816.com-海口彩票网软件下载| www.867876.cc-七星彩35期-| www.913768.com-万彩是如何赚钱的| www.964697.com-今日竞彩篮球比分| www.999894.com-海南体彩飞鱼指标| www.yf6.cc-彩票规则介绍| www.wt28.com-江苏快三号码图表| www.807576.com-福彩44期-| www.897227.com-竞彩足球胜负平开奖| 七彩www.53900o.com| www.53978.com-彩票十大网站排名| www.987063.com-竞彩足球大小球玩法| www.744363.com-彩宝网老版本| www.772064.com-派彩电子走势图代理| www.60462.com-中福彩传媒app| www.012456.cc-怎么制作彩票网站| www.608900.com-德州好彩app下载| www.884986.com-亿彩堂官网-| www.pt52.com-彩票争霸vl-| www.333168.com-公司送员工彩票| www.42iz.com-下载中国竞彩网| www.21663.cc-帮别人代玩彩票兼职| www.52099.cc-淘彩app怎么下载| www.96179.cc-彩票识别码在哪里| www.916505.com-足球彩票赔率怎么算| 818合彩www.www.8000hc.com| www.947639.com-彩票投注方案| 彩世界www.99788b.com| www.fs24.com-快三豹子通平均遗漏| www.vh11.com-约约彩票app| www.06955.com-福彩和差运用|