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.865520.com-彩票好中奖么| www.965604.com-爱乐透彩票福彩体彩| 大赢家彩票www.584311.com| www.hv29.com-内蒙快三杀号| www.yr55.com-足彩3场2关-| www.997837.com-福彩3d和差推荐| www.bs83.com-时时彩缩水软件在线| www.380202.com-星彩代刷网下载| www.490613.com-澳博彩票安全吗| www.199688.com-北京五分彩官方开奖| www.5345.vip-淘宝上能买彩票| www.64xk.com-老谢说彩预测3d| www.6263.cn-彩运网官方下载| www.5392.cc-人物彩铅画教程视频| www.34ot.com-七星彩开奖几套| www.4282.vip-河南乐彩uv卷材机| www.07671.com-五百彩平台-| www.56067.com-19cf彩富网-| www.cp269.com-广西快三今天开奖| www.08mq.com-快三追号公式| www.143.com-365彩虹屁语录| www.5391.biz-四川体育彩票兑奖| www.629407.com-赢钱彩网站可靠吗| www.308727.com-会员登录一9b彩票| www.451038.com-彩巴巴彩票-| www.558398.com-彩铅画卡通小动物| www.977085.com-好彩官方网站| www.029164.com-彩票分起投-| www.142699.com-彩虹8彩票代理| www.268085.com-在手机上买福利彩票| www.016648.com-福彩平台是真是假| www.101532.com-李彩桦-| www.176179.com-彩票计划网页| www.254682.com-好彩店彩票app| www.002397.com-苏州体育彩票兑奖| www.586544.com-糖果派对粉色彩金| www.666508.com-万达彩票是真的假的| www.751224.com-彩票巴巴网址| www.822050.com-买彩票有几种方法| www.904205.com-足彩及时比分500| www.965332.com-爱乐透福彩彩票| 成功彩票www.le33.cc| www.ij04.com-长沙体彩投注站| www.b55.club-特区微彩排列| www.61yg.com-彩票31app苹果| www.488089.com-聚象彩是什么平台| www.936009.com-大发彩票官方版| www.3489.vip-分分中彩网址| www.23428.cc-人工彩票计划网| www.477323.com-新粤彩报纸2019| www.560639.com-甘肃快三加奖| www.829007.com-87彩票管理-| www.906527.com-吉林快三二十号优势| www.979930.com-彩票店赊账犯法吗| www.lz.com-福利彩票安徽快三| www.981664.com-彩票驿站-| www.35391.cc-福彩双色球有假没| www.701284.com-首存彩金网-| www.9160.vip-七乐彩最新预测| www.21201.com-澳大利亚彩票怎么买| www.63836.cc-足球彩票圈怎么进| www.027610.com-易彩堂能提现吗| www.502175.com-500彩怎么买彩票| www.566329.com-49彩票娱乐-| www.641522.com-网络图标彩票网站| www.706915.com-体彩开奖31选7| www.786273.com-彩票查询结果大全| www.749010.com-中彩彩票黑平台| www.821550.com-佩奇彩票网快三| www.908638.com-怎样注册彩票网站| www.970173.com-燕赵福利彩票首页| 99彩票www.587989.com| www.398881.com-3d彩裤图吧-| www.557599.com-酷彩吧彩票骗子吗| www.644533.com-趣博彩票正规吗| www.878714.com-江西体彩投注站| www.949784.com-网上购彩票恢复时间| 六福彩票www.66ffu.com| www.fe57.com-广东福彩十分钟开奖| www.xq40.com-体彩第19037| www.31qn.com-什么彩票星期六开奖| www.28921.com-中彩手彩票图| www.89923.cc-那个网站博彩好| www.058959.com-新浪体育彩票网| www.739082.com-彩神通破解版| www.821136.com-吉林神采快三全能版| www.891687.com-彩票看走势图| www.957086.com-破解网络彩票| 500万彩票www.96386f.com| www.037791.com-大发快三众乐彩| www.203651.com-体彩快3开机号| www.894869.com-大乐透彩票机选投注| www.cx77.com-湖北快三下载| www.09847.com-体彩七位数今晚开奖| www.3500.me-注册彩票送钱| www.163322.com-福彩开奖排五| www.126621.com-天玺彩票-| www.92736.com-竞彩单关开奖结果| www.577029.com-人人中彩票解绑| www.7181.com-博彩众长-| www.356495.com-巨丰彩票贴吧| www.750155.com-手机在线购彩平台| www.851659.com-分分时时彩票下| www.946939.com-彩色沥青道路混凝土| www.991780.com-分分彩百分百稳赚| www.53334.cc-丰大彩票网-| www.px09.com-58彩票官方网址| www.3214.cc-中福彩票网-| www.733202.com-江苏体彩中心在哪| www.028.in-芽彩彩票-| www.25002.com-简单小清新彩铅画| www.954875.com-瑞彩祥云快三安全吗| www.7416.cn-网上刮刮乐彩票软件| www.128203.com-新2彩票网app| www.657324.com-电玩城彩票兑换方案| www.751310.com-网上不能买彩票了| www.813615.com-快三456下面出啥| www.886753.com-微信中国彩国际彩票| www.967194.com-即时开彩旧版| www.cp514.com-网上买彩票会坐牢吗| www.on21.com-福彩追加-| www.41.cc-七星彩开奖号号| www.877476.com-足彩正规吗-| www.942554.com-山东省体彩兑奖中心| www.995921.com-新浪体育足球彩票| www.bw10.com-江苏快三助手下| www.2979.com-非法经营网络彩票罪| www.w25.win-c39彩票-| www.06819.com-正规的福利彩票软件| www.715135.com-彩神争霸网站| www.861960.com-福彩时时彩怎么玩法| www.437272.com-上海体彩福彩下载| www.74559.com-天津彩色纸箱厂| www.58413.com-人人中彩票093| www.876368.com-福彩3d断组大全| www.019125.com-江苏彩礼多少| www.21693.cc-加彩票站老板微信| www.83683.cc-彩票的好处与坏处| www.003849.com-彩之源app网址| www.9340.biz-福利彩票大案| www.92272.cc-湖北体彩ll选5| www.091062.com-博应用时时彩下载| www.228858.com-广东好彩1开奖| www.2830.org-下载好彩投-| www.06428.com-福彩3d跨7的号码| www.931155.com-色彩风景-| www.993872.com-竞彩半全场玩法介绍| www.bp4.com-福彩快3走势图上海| www.12nd.cc-胜负彩二等奖怎么算| www.98vh.com-内蒙福彩微信公众号| www.2248.vip-彩票大彩嬴家网| www.020659.com-快三开奖跨度走势图| www.cs61.cc-哪个彩票平台高倍率| www.rg18.cc-快三免费的挂机软件| www.1lg.com-福彩体彩店转让| www.7117.xyz-爱乐透彩票炸金花| www.23427.com-网购彩票安全吗| www.282370.com-新彊福利彩票网| www.353987.com-英国彩票网站| www.406178.com-山东枣庄彩礼| www.789888.cc-大发快三老是输| www.869980.com-福彩3d开机号查询| www.994567.cc-重庆时时彩实时开奖| www.zn3.com-福彩快3内蒙开奖|