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.293856.com-博众快三软件| www.22485.com-彩票店整体转让| www.1488.org-腃龙时时彩做计划| www.22224.cc-传奇彩票没人查吗| www.021402.com-湖北省体彩中心官网| www.253855.com-青海快三推荐号| www.88552.cc-盗窃彩票中奖射幸| www.440408.com-河北银行库管买彩票| www.608370.com-大乐透唯彩推荐号| www.774320.com-3分彩分分彩开奖| www.923368.com-彩票站早上几点开门| 500彩票www.50080j.com| www.i25.top-掌上福彩宝典| www.798515.com-彩票中奖如何收税| www.947262.com-三地彩吧图庫| 大赢家彩票平台www.136503.com| www.77369.cc-手机怎么合法买彩票| www.886988.cc-相亲加彩票诈骗| www.872328.com-快三长龙最多| www.972731.com-彩1234彩票-| www.59636.cc-白菜彩票基地论坛| www.582050.com-福彩赚了多少钱| www.771115.cc-老时时彩走势360| www.632359.com-七星彩大彩网| www.rq54.com-官方手机购彩| www.253929.com-时时彩个位必中口诀| www.531256.com-数学公式算彩票| www.428218.com-彩票软件app开发| www.669567.com-上海彩钢房| www.590084.com-中国福利彩票虚假| www.2vh.com-999彩票百度百科| www.6634.xyz-山寨500彩票| www.664119.com-腾讯分分彩波动值| www.va84.com-彩票没人领河南| www.hu29.com-北京快三走势图昨天| www.0796.net-共赢彩票进入| www.qn68.com-福彩快三有人控制吗| www.390881.com-注册福彩账号| www.8779.cc-人工智能足彩新浪| www.009543.com-422app彩票-| www.460123.com-彩票分析助手| www.cp2345.com-百盈快三的技巧规律| www.8308.space-500万彩票技巧| www.807928.com-福彩三d预测最准确| www.060290.com-网昜彩票开奖直播| www.783433.com-彩38彩票领导者| www.zd69.com-彩03-| www.876374.com-怎样买彩票大小| www.695.website购彩3玩法技巧| www.266124.com-高频彩开奖时间调整| www.660282.com-腾讯ai彩-| www.r23.cc-惠泽了优彩社区| www.514471.com-xr原彩显示-| www.821825.com-湖北快三正文| www.tk4.com-江西快三推荐一定牛| www.5878.tv-9号彩票平台彩票| www.hr36.com-彩票号码预测| www.782308.com-中国彩票app| www.030626.com-珍爱网拉人玩彩票| www.2918.com-彩之云信息化平台| www.722993.com-中中彩网综合分布图| www.556794.com-澳门哪里买彩票| www.877208.com-七彩彩票是正规的吗| www.9086.cm-北京pk10赢彩王| www.840478.com-足彩有规律-| www.342200.com-彩溢会馆电话号码| www.984292.com-查北京快三开奖号码| www.768682.com-足彩app哪个靠谱| www.212722.com-私彩平台正规吗| www.47953.com-韩国彩票玩法规则| www.620695.com-上海彩票加奖| www.984809.com-买彩为什么会连输| www.10668.com-足彩实时欧赔| www.463468.com-福彩3d形态a| www.261350.com-时时彩稳赚不赔绝招| www.977159.com-甘肃省治理高价彩礼| www.81318.cc-香港高级彩图| www.139272.com-上海体彩电话投注| www.gz18.com-盈彩在线合法吗| www.87cu.com-淘宝为什么不买彩票| www.319007.com-微信福彩骗局| www.874744.com-华彩快三网赚平台| www.751064.com-玩彩票心态重要吗| www.233488.com-快三人工计划全开| www.hq17.com-体彩新浪彩票| www.869717.com-彩49导航-| www.101823.com-中原福彩-| www.17uf.com-彩票同期开出号| www.093293.com-宝赢彩票软件破解版| www.659777.com-彩票查看中心双色球| www.58we.cc-耐磨彩色混凝土做法| www.930532.com-福利彩票6加1规则| www.125.vip-中国体育彩票网购| www.108904.com-彩泥做法大全| www.271813.com-今晚好彩1开什么号| www.632908.com-极速3d彩票的玩法| www.rf42.com-北京福彩网官方首页| www.048877.com-福彩3d布衣钱树图| www.5ai.com-体彩排3开奖号码| www.82667.com-足彩19034盈亏| www.227449.com-时时彩最准平投方法| www.858941.com-查询彩票彩票开奖| www.95257.cc-彩妆盘发美甲加盟| www.n99.wang-免费分分彩挂机软件| www.58jb.com-重庆时彩怎样看走势| www.099785.com-福彩3d胆码-| www.505708.com-九二二四六天天彩图| www.8001.in-手机博彩输了十六万| www.720055.com-兴利彩票-| www.48449.com-竞彩优化工具app| www.081509.com-彩票游戏app| www.234589.com-快三大小单双买法| www.119637.com-彩票怎样看-| www.89221.cc-pk567彩票-| www.689096.com-山东彩沙龙论坛| www.yg05.com-福彩快三赔率199| www.086855.com-wfcp五福彩票| www.5320.cm-腾讯分分彩杀号教程| www.801578.com-手机购买彩票app| www.219409.com-中国福利彩票6+1| www.564996.com-金亚洲彩票下载| www.zc80.com-体彩实体店网上购买| www.4453.xyz-安嶶福彩快3开奖| www.274561.com-快三输了几十万| www.158227.com-手机版678彩票网| www.83tn.com-彩票5软件靠谱吗| www.069153.com-福建快三中奖规则| www.715188.com-826彩票正规吗| www.228692.com-彩钢围挡设备| www.1931.xyz-福利彩票十一先5| www.55321.cc-快三多少倍封顶| www.715176.com-快三老师可信吗| www.5745.top-河北体彩排列三开奖| www.198582.com-体育彩票开奖| www.88133.com-有充值红包彩票网站| www.097303.com-体彩3d基本走势图| www.232355.com-吉林快三出的什么号| www.548883.com-双赢彩票地址| www.106305.com-七彩云app下载| www.377063.com-明星彩票app网址| www.576340.com-中彩网3b开奖号码| www.717735.com-彩票试刮-| www.79ro.com-福彩中了三个号码| www.203204.com-熊猫在线彩票下载| www.799902.com-180彩-| www.tz79.com-体彩竞彩怎么看奖金| www.75599.com-彩票固定规律公式| www.488216.com-重庆私私彩-| www.969652.com-快三购买技巧| www.79595.com-彩捷报图迷总汇| www.081088.com-七星彩奖金分配| www.444844.com-网上买怎么买彩票| www.973213.com-女的唱的歌词里彩虹| www.55986.com-金彩网下彩天空网| www.498066.com-神兽竞彩团队公众号| www.812922.com-手机彩膜怎么贴视频| www.0xe.com-能中奖的彩票号码| www.1668.pw-五行预测彩票3d| www.154888.com-竞彩技巧讲座| www.602098.com-彩票店挣钱吗| www.737315.com-人工智能选彩票| www.fc83.com-青海快三开奖走势图| www.08xj.com-国家许可的网络彩票| www.051888.cc-九万彩票老版|