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天

知道了
百盈PK10 www.804706.com-时时彩彩-| www.978548.com-易旺彩票下载| www.5358.cn-永利彩票网信得过吗| www.602602.com-中国福体彩开奖信息| www.925228.com-财神8彩票网正规| www.72qz.com-竞彩容错怎么算| www.lv10.com-彩票站对账公式| www.59zw.cc-730彩票网-| www.96524.cc-3月17日竞彩预测| www.076651.com-梦到彩票号码| www.555601.com-乐彩网最新开奖公告| www.706377.com-收中国福彩开奖号码| www.889076.com-天津店主助手彩票| 乐彩赢www.0014e.com| www.431077.com-竞彩单关开奖统计| www.96572.cc-足球彩票中奖怎么算| www.262015.com-河北快三输了几十万| www.447516.com-福彩2d怎么买| www.627322.com-福彩175000-| www.595603.com-k彩娱乐开户| www.021579.com-新皇冠彩票-| www.251078.com-爰彩彩票-| www.674122.com-36o彩票网排三| www.768576.com-查体育彩票开奖结果| www.870447.com-三分彩最准计划| www.974047.com-快三秒招聘-| www.ik32.com-福彩快三专家推荐号| www.18ov.com-每周三开奖的彩票| www.696551.com-香港时时彩是真的吗| www.171000.com-河北省快三开奖时间| www.44579.com-福彩东方61走势图| www.903026.com-彩票路途遥远任务重| www.978943.com-黑好彩-| www.az55.com-澳门快三官网开奖| www.769226.com-3好彩网-| www.231338.com-天天彩票app网址| www.383397.com-彩票在线投注平台| www.738511.com-快3中国彩票| www.865908.com-深圳熊猫彩票| www.977072.com-彩礼超过两万犯法吗| www.ij72.com-微信上的广东福彩| www.17py.com-体育彩票重启时间| www.56615.cc-张家口福利彩票中心| www.14974.com-全民平台彩票可靠吗| www.016353.com-彩票k线做计划| www.115117.com-彩神通4码准不准| www.22009.cc-彩票店网络售彩| www.78327.cc-七星彩票信息| www.738963.com-大通彩票手机板| www.842480.com-福彩公益项目目的| www.921985.com-365彩票下载安装| www.990037.com-下载时时彩软件| www.dd64.com-福彩彩票-| www.819157.com-千里马彩票计划| www.vb56.com-福彩双胆专家预测| www.4399.cn-买彩票怎么选倍数| www.197878.com-中国彩票开奖走势图| www.330879.com-彩神国际怎么做代理| www.973356.com-彩虹岛怀旧经典游戏| www.iw33.com-竞彩网直播比分直播| www.808928.com-彩票大乐透历史号码| www.966572.com-澳门五分彩-| www.kg90.com-快彩是国家正规的吗| www.279280.com-青海快三下载| www.50ei.com-福彩藏机诗汇总| www.691815.com-新彩票走势网大乐透| www.532228.com-香港彩宝典软件下载| www.706699.com-玩私彩属于赌博吗| www.919999.com-网上买彩票能挣钱吗| www.gh41.com-广西快三号码推荐| www.652873.com-三d众彩网专家预测| www.552273.com-大家赢彩票网合法吗| www.dq.cc-彩68app下载| www.047974.com-8k彩票网站安全吗| www.5523.xyz-m5彩票网官网首页| www.381980.com-宁夏休育彩票大乐透| www.84gs.com-全中彩票软件| www.383017.com-易彩输了几十万| www.480910.com-和彩云网页登录| www.557983.com-彩票大赢家主页| www.632892.com-极速3d彩票能玩吗| www.697721.com-时时彩和值大小玩法| www.769799.com-玩时时彩可以赚钱吗| www.835979.com-大乐透彩票中奖新闻| www.895130.com-爱投彩票赚钱吗| www.954564.com-彩宝网试机号走势图| 购彩票www.c5909.com| www.935392.com-101彩票平台| www.jj9.com-北京快三开奖网站| www.872710.com-大乐透彩票字谜图迷| www.87414.com-穷人买彩票中奖电影| www.074733.com-彩富网香港资料大全| www.924868.com-贵烟多彩-| 彩乐乐www.cll168.com| www.41wb.com-浙江体彩飞鱼走势图| www.0978.bid-快乐彩大小技巧稳赚| www.938256.com-彩票公司-| www.8528.cc-彩票坊赚钱吗| www.807492.com-彩票老师带单合买| www.886334.com-亚博体育假彩票| www.315181.com-建盏七彩效果图| www.433316.com-818彩吧预测| www.609361.com-福彩贴吧论坛| www.505943.com-体彩案件-| www.639652.com-快三网投下载| www.cp0933.com-快三软件能破解吗| www.931812.com-淘金网买足彩骗局| www.gk86.com-众彩彩票下载| www.34ua.com-七星彩还未开的好| www.105692.com-八亿彩官方下载| www.24nz.com-手机彩膜制作设备| www.613139.com-福彩l-| www.240.com-福利三d彩票走势图| www.8459.pw-下载一个爱彩乐| www.7722.space-网上彩票168平台| www.35578.com-第一红彩店下载| www.93977.com-福利彩票宣传方案| www.056512.com-高频彩票平台在海外| www.3659.cc-彩票分析app| www.23113.cc-彩票单双怎么算| www.82366.cc-杭州竞彩快三出奖| www.033067.com-128彩票诈骗| www.107586.com-01彩票ios-| www.186677.cc-国外正规彩票平台| www.1393.cm-彩票3d字谜图谜| www.184520.com-彩票号码筛选器| www.949912.com-百宝彩视-| 大赢家彩票www.589411.com| www.257698.com-安徽快三免费计划| www.331122.cc-彩票3d走势图连线| www.898038.com-中国福利彩票图案| www.960042.com-广发彩票平台可靠吗| 福彩www.26878j.com| www.722275.com-大庆福彩中心周六| www.425708.com-官方福彩彩票网站| www.545598.com-八仙时时彩手机版| www.611866.com-福彩投注站点查询| www.673488.com-古建筑旋子彩绘图案| www.379196.com-购买世界杯足球彩票| www.3787.top-彩先知彩吧论坛| www.067316.com-正规三分时时彩网站| www.168946.com-福彩快3走势图今天| www.397515.com-章鱼彩票贴吧| www.on59.com-福彩都啥玩法| www.124.org-丽盈娱乐时时彩| 99彩www.9jjc.com| www.hv48.com-北京快彩开奖| www.p17.cn-美国彩票规则介绍| www.389364.com-东莞长安福利彩票店| www.381804.com-达芬奇密码彩票算法| www.25nd.com-淘宝彩票网合法的吗| www.203535.com-江苏快三走势| www.295411.com-彩吧吧全图-| www.379985.com-今天彩票中奖号| www.7483.cm-91彩店联盟-| www.942507.com-深圳体彩兑奖中心| www.698085.com-今日福彩报纸| www.188520.com-买彩大厅-| www.809196.com-福彩中奖几率是多少| www.878962.cc-五位数的彩票| www.941162.com-大发快三代理如何做| www.979595.com-注册送彩金的网址| www.0020.site-搜狗彩票交易平台| www.833780.com-羊城晚报晚晚好彩板|