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.74zk.com-体彩什么时候开卖| www.134238.com-旋子彩画高清图案| www.291338.com-彩神viii-| www.388176.com-时时彩刷彩金套现| www.24.gg-高平彩钢瓦-| www.480967.com-和彩印关闭-| www.689230.com-天天彩票网官网| www.5485.vip-家彩网胆码胆码预测| www.168066.com-河北快三综合| www.321820.com-百度爱彩票-| www.855796.com-七乐彩算法-| www.685598.com-福彩3d字谜区| www.820137.com-合水为彩礼杀人| www.cai8211.com河北省快三开奖时间| www.545141.com-四川体彩网排列五| www.di51.com-青海快三今天推荐号| www.114573.com-今日3d彩圣字谜| www.9dl.cc-多盈彩票网址多少| www.8674.com-七星彩杀头尾准确| www.026057.com-澳门博彩十大平台| www.381984.com-彩仙阁挂机论坛| www.716195.com-快三好假-| www.99sc.com-彩神彩票黑钱吗| www.363444.com-掌上时时彩苹果版| www.337161.com-河北快三规律| www.194883.com-快三买和值-| www.785666.cc-金慱彩票-| www.994348.com-彩票投注网站排行榜| www.365033.com-体彩是骗人的吗| www.260205.com-浙江彩票兑奖地点| www.972084.com-大众彩票手机版| www.vl72.com-下期彩票开奖预测| www.1105.wang-竞彩比分中奖18万| www.637062.com-彩虹七号电池| www.52ir.cc-时时彩三星缩网页版| www.26264.cc-彩神全能计划手机版| www.527888.com-时时彩改码诈骗| www.050.pw-彩票首富-| www.ek9.com-上海快3爱彩乐| www.765316.com-篮球彩票从哪买| www.rs24.com-皇都彩票1分快3| www.393277.com-画风景画彩铅画| www.846618.com-买福彩3d赚钱绝招| www.56596.cc-东方彩票网投领导者| www.197733.com-中国彩票开奖大全| www.yq01.com-韩国有彩票吗| www.396520.com-实亿彩票平台可靠吗| www.10ib.com-冠彩网怎么进不去了| www.55233.com-体彩大乐透直播现场| www.189833.com-河北彩票快3规则| www.112906.com-老梁观世界彩票| www.387621.cc-手机网投彩票网站| www.907756.com-快乐彩开奖公告查询| www.303230.com-彩虹网络电视手机版| www.893353.com-七乐彩在线选号工具| www.532963.com-七星彩j几点开奖| www.661806.com-竞彩回查-| www.358849.com-江苏快3彩乐乐网| www.959025.com-彩票吾爱破解| 计划网--新浪彩票相同盘| www.37093.com-什么是公彩-| www.189180.com-两分快三开奖| www.978572.com-福彩3d口诀妙用| www.520577.com-凤凰彩票f72| www.538630.com-大花猫1彩吧图库| www.25764.com-仟喜彩票是骗人的吗| www.57976.cc-旺彩双色球管网| www.559037.com-福彩缩水软件手机版| www.cai1699.com快三大小单双app| www.yt03.com-吉林省体彩领奖中心| www.642118.com-济南福彩抽汽车| www.121192.com-河南快三奖金规则| www.6011.cm-打彩票上-| www.314286.com-唯彩会首页-| www.899311.com-湖北快三分析预测| www.057068.com-买彩票攻略-| www.77qh.com-网易福粉快三| www.21933.cc-如何刷彩-| www.294217.com-福彩10选5骗局| www.gt89.com-广西快三奖金图片| www.341120.com-体彩二等奖兑奖地点| www.00693.com-中国彩吧更懂采民| www.804473.com-cp1248彩票-| www.lc.cc-极速快三立即开奖| www.2254.cc-梦见彩票中奖后真中| www.hi33.com-福彩的玩法-| www.15415.com-分分时时彩前三预测| www.819190.com-彩票何时线上投注| www.6481.cn-天猫体彩店加盟| www.019434.com-贵阳市体彩管理中心| www.976247.com-49彩票集团网站| www.260809.com-3d中彩娱乐-| www.525018.com-今天福彩3d无名图| www.a78.cn-北京福彩快乐8开奖| www.378232.com-手机号百彩票下载| www.713597.com-王者彩票网站首页| www.062840.com-网上买彩票能报警吗| www.333016.com-爱投网彩票客服电话| www.526850.com-代打彩票有风险吗| www.188217.com-江苏爱彩乐快三| www.ku36.com-辽宁快三彩票| www.xd00.com-大乐透凤彩网杀码图| www.79hx.com-全国有多少专业彩迷| www.1315.org-彩票中奖几天兑换| www.xz44.com-k8彩票网-| www.529309.com-大佬彩票平台| www.097.cm-利彩亲彩票-| www.4721.xyz-中国红彩票中奖几率| www.sv95.com-五鬼运财符买彩票| www.60fl.com-易购彩票技巧| www.327168.com-澳洲3分彩开奖结果| www.920862.com-优乐彩票下载安装| www.022780.com-福利彩世界下载地址| www.548.in-昨天七乐彩开奖结果| www.365249.cc-彩民周刊专家组小宋| www.218073.com-旧版彩神争争霸| www.397347.com-足彩胜平负比分直播| www.50ud.com-双色球软件彩计划| www.101312.com-天天福彩官网| www.790938.com-好彩香烟蓝莓爆珠| www.883481.com-彩王之王的彩票专栏| www.940911.com-福彩pk10官网| www.653370.com-时时彩定胆做号技巧| www.37733.cc-彩虫安卓版-| www.134009.com-安微快三走势一定牛| www.4951.cc-彩九苹果版下载安装| www.553787.com-凤凰天机六个彩资料| www.729119.com-福彩网址大全| www.4yv.cc-福彩中福在线怎充钱| www.44901.com-福利彩票微信群有吗| www.7181.loan-国外博彩公司工作| www.uc3.cc-体彩开奖号码| www.886774.com-相亲彩票-| www.899660.com-申请宁夏福利彩票| www.472020.com-香港三色彩有限司| www.981914.com-买大发快三违法吗| www.357865.com-152彩票软件| www.571789.com-彩虹六号围攻新角色| www.078070.com-西安彩票刘亮| www.34263.com-中国体彩网5| www.045451.com-彩神通4码-| www.650990.com-云南休彩-| www.823550.com-彩涂钢板工艺| www.7682.vip-福彩3d坐标-| www.884154.com-彩票攻击软件| www.12638.cc-快三数字生成机制| www.092968.com-快8彩票中奖规律| www.268060.com-看彩-| www.733670.com-微信上快频彩的| www.891208.com-最流行的彩票广告语| www.18772.cc-128福彩官网| www.89665.com-大彩烟多少钱| www.181291.com-808彩票票网| www.566062.com-怎样买彩票能中大奖| www.831909.com-中国福彩七乐彩规则| www.945188.com-345彩票软件| www.293596.com-河南彩票中心在哪里| www.439621.com-体育彩票中奖率| www.908758.com-安徽快三在哪里买| www.77js.cc-七乐彩十大专家汇总| www.666035.com-乐彩网最高邀请码| www.91cu.com-5分快三规矩| www.4480.cn-北京快三有啥规律吗| www.24488.cc-古风人物彩铅画教程|