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天

知道了
彩票123现在叫什么名字 www.7093.biz-博创彩票网址官网| www.98640.com-365约彩-| www.928051.com-时时彩后二公式| www.550373.com-周口彩票店-| www.377016.com-江苏快三出奖结果| www.984258.com-竞彩猫是什么| www.wb39.com-qq彩票在哪-| www.327917.com-立彩彩票三期| www.397024.com-万国彩票是正规的吗| www.793610.com-贵州快三最新预测| www.875484.com-5分快三计划软件| www.969849.com-彩票毁了多少人| 500彩票网www.607993.com| www.505695.com-天下彩949ccc| www.573115.com-928彩票app-| www.204896.com-快三图片跨度图片| www.1142.org-篮球彩票胜负推荐| www.qo17.com-体育彩票公益介绍| www.19661.com-老挝博彩案件| www.at13.com-甘肃快三遗漏动态| www.76.gg-万达娱乐彩票app| www.6099.vip-釉中彩骨质瓷5a| www.067739.com-玩彩票去什么平台好| www.7094.cc-银川银燕七彩| 8号彩票www.60108l.com| www.tv94.com-优彩社区aapp| www.653157.com-最新吹吹七星彩| www.795001.com-上海体彩店转让信息| www.969855.com-七乐彩4拖6多少钱| www.hv49.com-福彩3d的和差| www.89vx.com-彩经网官网电脑版| www.787342.com-快速查体彩开奖| www.979961.com-江苏省福彩在哪里| www.sv01.com-彩票五码的倍投方法| www.1481.xyz-精彩中国说程家家| www.246506.com-3d试机号彩宝网| www.373401.com-凤凰购彩登录| www.500556.cc-体彩竞猜足球怎么看| www.579325.com-汕尾a家逸彩| www.872779.com-8k彩票购彩大厅| www.2823.in-k8彩票软件下载| www.21622.cc-时时彩可以赢钱吗| www.152963.com-手机时时彩k线图| www.302680.com-晴予七星彩预测| www.446668.cc-彩票x技术-| www.556459.com-七星彩历史同期号码| www.846288.com-竞彩中奖概率最高| www.959391.com-五分时时彩人工计划| www.rj63.com-福彩8app-| www.0090.pro-有关彩票的昵称| www.13553.cc-竞彩串关计算器| www.79883.com-彩票线报网-| www.0318.in-体彩机过户-| www.167261.com-广西快三开奖| www.275383.com-彩01彩票下载安装| www.817834.com-彩票表格模板| www.919599.com-制作自己的彩票网站| www.993703.com-足彩今日单关| www.ix60.com-全民中彩票打不开| www.1ni.com-人们是否应该买彩票| www.85no.com-福彩中彩网三d开机| www.532030.com-临沂体彩机转让| www.663368.com-非法彩票网站| www.807065.com-温州福利彩票网| www.898288.com-梦见七星彩中奖故事| www.998672.com-外围竞彩app| www.726219.com-购彩网新-| www.801850.com-大连彩票店转让| www.885489.com-滴滴彩票app| www.996884.com-机选一注七星彩号码| www.kz39.com-福彩28是什么| www.q49.org-彩票弃奖记录| www.5782.biz-北京速开彩是个骗局| www.27274.com-体彩单场胜负投注| www.07gf.com-上期福利彩票结果| www.76326.cc-足彩2串1稳赚不赔| www.066664.com-外国博彩app| www.5449.cn-香港跑马高频彩票| www.079050.com-599彩票-| www.154326.com-掌上中彩彩票| www.222187.com-快三必中的十大规律| www.393225.com-株洲福彩中心在哪里| www.527718.com-乐彩网能赚钱吗| www.16088.com-福彩3d字谜解释| www.70ce.com-中彩票网首页| www.101557.com-360竞彩比分| www.203996.com-上海福彩基诺走势图| www.280955.com-时时彩稳赚不赔公式| www.369460.com-彩民红心水-| www.466616.com-七乐彩中奖在哪领奖| www.558915.com-生日祝福彩虹屁| www.647094.com-胜负彩中奖技巧| www.731440.com-易彩堂主页搜不到| www.810720.com-体彩大乐透周几开奖| www.889908.cc-七乐彩那天有| www.954409.com-快三开奖安徽| 万彩网www.wcp666888.com| www.oo60.com-3d新彩吧预测汇总| www.00yw.com-湖北快三技巧走势图| www.87fo.com-小白彩票官方网站| www.563396.com-可以查彩票的软件| www.650752.com-十字彩是什么| www.730996.com-彩票梦想专用| www.811322.com-广西快三多久开一次| www.898436.com-福利彩票32期开奖| www.973200.com-彩虹自助下单| www.bs56.com-福彩快三软件购买| www.3993.bid-西甲看什么博彩公司| www.35976.com-快乐彩票三支付中心| www.000974.com-竞彩258论坛| www.7799.net-足球竞彩口诀| www.561083.com-盈利彩票下载| www.651070.com-水彩画简单画星空| www.717849.com-彩民周刊编辑组专家| www.793882.com-利民彩票正规吗| www.854626.com-酷彩网是真的吗| www.902662.com-极速快三怎样买赚| www.956982.com-中国福彩官网app| 星际www.930xj.com| www.ci09.com-吉林快三害死我了| www.862740.com-彩票同期开奖号码| www.658439.com-彩视横屏怎么做| www.656759.com-色彩的搭配-| www.733236.com-江苏体彩大乐透最新| www.802409.com-吉林省福彩12选5| www.874393.com-2d福彩奖金-| www.960354.com-go8015彩票网| www.ev60.com-中彩网手机版| www.zp11.com-3132彩票下载| www.54919.com-福彩三的缩水| www.024053.com-香港官方彩票| www.133237.com-七星彩最近十期号码| www.242977.com-手机买彩票哪个靠谱| www.333590.com-酷彩吧中奖会给吗| www.45076.com-彩票可信吗-| www.038213.com-九九集团app彩票| www.774274.com-重庆十字彩走势图| www.960039.com-哪个彩票网站送彩金| www.dm70.com-大马彩票平台| www.yg24.com-白银市福彩中心| www.29jy.com-福彩能买到大乐透吗| www.826787.com-98c彩票线路导航| www.856124.com-幸运快三代玩微信| www.472797.com-牛人彩票app下载| www.579084.com-彩票双色球媒体预测| www.670661.com-福彩水果农场有假吗| www.770966.com-时时彩88平台注册| www.868731.com-七星彩稳赚不赔秘诀| www.959744.com-福佳彩官方网| www.dh38.com-快乐彩票彩种| www.b43.cn-私彩平台排名前十图| www.390.bid-中彩堂新的网址| www.962476.com-深圳福彩鑫-| www.cai5099.com新手怎么买彩票| www.1992.wang-彩票微投资是真的吗| www.v65.org-3d彩报一版-| www.99yw.com-三彩彩票是真是假| www.062452.com-买彩票的技巧大全| www.159222.com-福彩快3贵州| www.258049.com-福建即乐彩中奖| www.4577.cn-顶尖的彩票投注网站| www.9850.cc-古建金龙和玺彩绘| www.34708.com-福利3d开门彩今天| www.70mf.com-七乐彩奖池查询|