QQ客服
当前位置 : 首页 > 代码 > 网页特效 > 导航菜单 > jQuery动态添加多级收缩菜单

jQuery动态添加多级收缩菜单

jquery使用json数据格式动态创建多级下拉收缩菜单导航。
分享到微信朋友圈
X

使用方法:

1、head引入css文件

<!--页面布局,可忽略!-->
<link rel="stylesheet" type="text/css" href="css/m-base.css" />

<!--左侧导航样式-->
<link rel="stylesheet" type="text/css" href="css/LeftNav.css"/>

2、head引入js文件

<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/LeftNav.js" type="text/javascript"></script>

3、body引入HTML代码

<div class="left"></div>

<script>
	var menu = {
		name: '', //名字
		level:'0',
		haschildren: true, //是否有子节点
		url: '#', //url路径
		isopen: false, //是否展开
		children: [{ //子节点
			name: '1',
			level: '1',
			haschildren: true,
			url: '',
			isopen: true,
			children: [{
				name: '1.1',
				level: '2',
				haschildren: true,
				url: '',
				isopen: true,
				children: [{
					name: '1.1.1',
					level: '3',
					haschildren: false,
					url: '14-1.html',
					isopen: true,
					children: ''
				}, {
					name: '1.1.2',
					level: '3',
					haschildren: false,
					url: '#',
					isopen: false,
					children: ''
				}]
			}]
		}, {
			name: '2',
			level: '1',
			haschildren: true,
			url: '#',
			isopen: false,
			children: [{
				name: '2.1',
				level: '2',
				haschildren: true,
				url: '#',
				isopen: false,
				children: [{
					name: '2.1.1',
					level: '3',
					haschildren: false,
					url: '#',
					isopen: false,
					children: ''
				}, {
					name: '2.1.2',
					level: '3',
					haschildren: false,
					url: '#',
					isopen: false,
					children: ''
				}]
			}, {
				name: '2.2',
				level: '2',
				haschildren: true,
				url: '#',
				isopen: false,
				children: [{
					name: '2.2.1',
					level: '3',
					haschildren: false,
					url: '#',
					isopen: false,
					children: ''
				}, {
					name: '2.2.2',
					level: '3',
					haschildren: true,
					url: '#',
					isopen: false,
					children: [{
						name: '2.2.2.1',
						level: '4',
						haschildren: true,
						url: '#',
						isopen: false,
						children: [{
							name: '2.2.2.1.1',
							level: '5',
							haschildren: false,
							url: '#',
							isopen: false,
							children: ''
						}],
					}]
				}]
			}]
		}]
	}
	//leftNav(menu)
	$.leftNav(".left",menu);
</script>
[声明]本站素材来自用户分享,仅限学习交流请勿用于商业用途。如损害你的权益请联系客服QQ:2447402004给予处理。
举报×
举报原因:

相关代码

二维码
意见反馈
×
×

注册

QQ注册 立即下载 新浪注册 立即下载

签到成功!

已连续签到1天,签到3天将获得积分VIP1天

知道了
金山彩票 www.91708.com-好彩788-| www.kh35.com-体彩大乐透跨度走势| www.3rx.com-京彩7515下载| www.0008.cm-彩票有6位数字的吗| www.16778.cc-辽宁福彩中奖详情| 利民彩票www.216777aa.com| www.ob2.com-甘肃快三免费下载| www.il33.com-山东彩票论坛3d| www.v64.cn-上海快三计划微信群| www.945635.com-福建省福彩快乐| www.43sb.com-北京福彩3d研究院| www.727018.com-乐彩网彩票-| www.062.loan-高清彩漫爱玩教师| www.551353.com-四场进球彩票| www.yl09.cc-万彩吧_彩票高手| www.087736.com-足彩胜负彩新浪爱彩| www.436796.com-中国福彩官方下载| www.717030.com-彩铅画的目的| www.900069.cc-盈彩网app官网| www.63by.com-福彩基诺开奖| www.972841.com-彩客网比分直播版| www.uk03.com-彩宝彩票app下载| www.130951.com-彩礼谁先提-| www.974057.com-福彩刮刮卡中奖图片| www.567462.com-彩虹5号无人机多长| www.598005.com-彩票投注量-| www.bp38.com-彩2彩票-| www.191919.cc-福彩三d走势图综合| www.7001.cn-福利彩票大乐透规则| www.50761.com-风发彩票qq-| www.278286.com-乐盈彩票app下载| www.234585.cc-致富彩票是骗局吗| www.024538.com-体彩组三玩法| www.8930.cc-靠谱的博彩-| www.370937.com-时时彩1010cp| www.833733.com-美版无嘴好彩| www.vu44.com-彩票k线-| www.805812.com-中国福彩有几种| www.935105.com-彩名堂怎么打最稳| www.cai3555.com北京快三结果查询| www.357920.com-黄金定律彩票应用| www.489438.com-购彩网拼音怎么拼| www.608974.com-中国体彩七星彩奖历| www.33079.com-江苏快三秘籍| www.5903.cn-榆次福利彩票站| www.824813.com-周口市福彩中心| www.3714.win-乐优炫彩最新版本| www.40549.com-中彩彩票qq群| www.26880.com-分分彩数字规律| www.731120.com-上海福彩网首页| www.45bu.com-彩虹三无人机价格| www.00ak.com-大富彩票不让提现| www.q88.online-福彩河北快三| www.1853.wang-3d福彩网址-| www.121809.com-陕西假宝马彩票| www.dn99.cc-天马彩票天一团队| www.315803.com-分分快三中奖技巧| www.827819.com-乐猫彩票下载手机版| 500万彩票www.638802.com| www.611206.com-彩虹物语-| www.997348.com-苹果彩票投注app| www.87156.com-今日彩票中奖号码是| www.ev5.cc-时时彩预测器| www.89457.com-新彩彩票是什么| www.174304.com-今日快三开奖示图| www.336558.com-快钱彩票是合法的吗| 500彩票www.361477.com| www.e15.mobi-好123彩走势图| www.0905.org-彩票跟单平台| www.32172.com-足彩比分50-| www.067213.com-谁有时时彩的平台| www.261235.com-苏州快三跨度走势图| www.xu32.com-彩票守号中的最大奖| www.39qz.com-七星彩搬家码| www.517.cc-河南幸运彩票开奖| www.3581.biz-连红彩票停止| www.222382.com-幸运分分彩一期计划| www.707985.com-喜来登彩票下载| www.814910.com-河北省体育彩票中心| www.886250.com-合买彩票月赚上万| www.988274.com-仲彩是黑平台吗| www.md17.com-中原彩票网网址| www.675203.com-乐发彩票主页| www.761297.com-彩票跨省可以兑奖吗| www.974351.com-福彩一个星期开几次| 众乐彩票www.905844.com| www.lm28.com-淘彩票网站-| www.w08.net-快三qq群群-| www.47vs.com-好的福彩3d的书籍| www.502581.com-快3私彩-| www.578180.com-辽宁锦州快三查询| www.652106.com-福彩快频彩安全吗| www.715279.com-足彩票达人预测准吗| www.787818.com-彩客化工-| www.855836.com-七乐彩单式30选7| www.913373.com-天天彩票兔兔向前冲| www.972305.com-体彩下载并安装| www.cai3456.com彩票破解术-| www.mu85.com-体彩排列5走势图| www.586288.com-彩票二等奖怎么看| www.473342.com-67期福彩开奖| www.563491.com-彩票店打票就收款| www.643118.com-彩妆美容化妆学校| www.722201.cc-复杂彩铅画图片大全| www.804316.com-哪个网址能买彩票| www.875063.com-分分彩中奖规则| www.939771.com-吉林快三官网电话| www.997798.com-彩票中心投诉电话| www.hw77.com-中国体育彩票手机版| www.zy42.com-欢乐七天彩下载| www.247029.com-彩票分析师收入| www.xa21.com-体育七星彩现场直播| www.355348.com-智博微彩城公众号| www.3778.com-特区彩票排列五图规| www.7618.top-爱彩人安卓版| www.0580.in-福彩3d水果图| www.032235.com-彩票在线人工计划| www.095928.com-四川省体彩兑奖中心| www.0776.bid-258篮球竞彩网| www.7882.com-3d中彩网走势连线| www.30003.cc-忆彩彩票官网址| www.9101.xyz-彩霸王资料大全| www.49500.com-福建省福利彩票兑奖| www.999706.com-长沙彩票中奖| 500彩票www.372477.com| 好彩头彩票www.90305d.com| www.5953.cn-长春省体彩中心地址| www.022653.com-天外飞仙彩吧图| www.139919.com-佰盈彩票安全吗| www.979327.com-苏式彩绘-| www.xl76.com-甘肃体彩官网| www.3682.cc-足球彩票竞彩足彩| www.71wc.com-随机买彩票会中奖吗| www.ht20.com-体育彩票网-| www.08xr.com-3乐彩是骗人的吗| www.373052.com-彩票3d财神论坛| www.499494.com-彩票133平台靠谱| www.562593.com-开福利彩票店挣钱吗| www.630085.com-76cp彩票真假| www.687143.com-五福彩票ios下载| www.678528.com-下载旧版彩视| www.50mw.com-德国鲸彩漆价格| www.1514.net-彩c16官网下载| www.108579.com-足彩赚钱的人| www.350861.com-手机彩膜通用| www.810832.com-体育彩票飞鱼| www.890211.com-快三最新开奖结果| www.966305.com-体彩图谜第二版| www.hd5.cc-安徽快三推荐号| www.o82.com-福彩旗下的快开彩票| www.8835.in-亚投彩票用户注册| www.3186.wang-彩票签到送现金| www.8978.org-当今最新彩票走势图| www.087062.com-福运彩票是真的吗| www.419365.com-黄金白金彩金哪个好| www.590279.com-顶呱刮彩票招财猫| www.690053.com-333彩票网登录| www.055889.com-黄金分割点计算彩票| www.178187.com-河北省快三专家预测| www.073361.com-网上怎么购买彩票| www.573236.com-阐彩-| www.154508.com-福利彩票色子点数| www.103854.com-苜页牛洼彩票| www.225111.cc-宝马彩票app软件|