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.141369.com-彩店宝彩票靠谱吗| www.557407.com-重庆十字彩规则| www.652696.com-北京时时彩平台官网| www.789800.com-竞彩足球的庄家是谁| www.444721.com-ff14彩票-| 网易彩票www.080wy.com| www.716515.com-彩铅画河水-| www.188672.com-江苏体彩e球彩开奖| www.514138.cc-泰国时时彩合法吗| www.22152.com-玩时时彩输死了| www.90699.com-中国体彩网二维码| www.062946.com-快捷彩票下载| www.852325.com-波叔竞彩推荐| www.350599.com-彩色笔记本-| www.442808.com-福彩推荐-| www.122247.com-彩神喷绘机官网| www.03911.com-豪彩平台-| www.63657.com-竞彩足球唯彩| www.ti24.com-快三北京-| www.23du.com-9万彩票旧版| www.11359.cc-七彩网app下载| www.68126.cc-高手彩-| www.697727.com-彩仙散胆专家专栏| www.5507.com-网银福利彩票缴费| www.208793.com-牛彩快3专用走势图| 福彩天下www.805836.com| www.751017.com-福38彩票网-| www.692189.com-高频彩黑平台| www.882011.com-博彩套利-| www.690110.com-盛彩彩票官方网站| www.783223.com-环球彩票9028| www.885361.com-体彩天下大厅| www.960994.com-杏彩注册平台官网| 皇家彩票www.92967a.com| www.967491.com-彩票托很多来自厦门| www.pq76.com-云南快三查询今天| www.414062.com-我挂彩了-| www.542158.com-怎么查询体彩| www.631400.com-七彩颜色的图片| www.711612.com-19048期七星彩| www.791805.com-彩票预测下期| www.866423.com-搜狐体彩网-| www.937312.com-辽宁福彩app| www.997338.com-登录奔驰彩票app| www.bl63.com-利彩下载安装| www.uf11.com-快三赚不赚钱| www.31wi.com-彩虹宝宝彩虹宝宝| www.7707.pw-江苏快三有规律么| www.630358.com-福利彩票开奖彩票| www.36792.com-南京快三走势图| www.137374.com-彩票绝密出好算法| www.419452.com-易彩网开奖结果| www.439615.com-西安未央区福彩转让| www.3183.top-好彩棋牌-| www.202792.com-福彩基诺奖励规则| www.412883.com-篮彩预测分析| www.yh94.cc-彩票777正规吗| www.775970.com-时时彩输到想死| www.8943.me-全民彩票时时| www.137605.com-app彩票微信登陆| www.344078.com-彩票123助手| www.526584.com-厦门彩票怎么样| www.646964.com-足彩12转9算法| www.789194.cc-澳洲时时彩网站| www.944390.com-体育彩票机选能尾数| www.dh36.com-天天彩票彩种| www.2jv.com-求彩票app下载| www.77648.cc-金福彩票网挣钱| www.319234.com-七星彩大奖软件| www.536412.com-白菜大全自动送彩金| www.41982.com-d9彩票cc-| www.447338.com-足彩单关购彩| www.588273.com-福彩5188图谜| www.671449.com-3d图谜彩票| www.782888.com-卓易彩票官方网址| www.44iu.com-彩93彩票ios| www.867.live-彩铅樱花树怎么画| www.901209.com-江苏快三和值跨度图| www.974832.com-体彩网手机比分| www.m13.net-福彩三毛三d图库| www.44oi.com-国彩跟单合买| www.519043.com-国际高频彩票有哪些| www.2961.top-福彩3d牛彩杀码图| www.17497.com-彩票挂机靠什么赚钱| www.62176.com-双彩球预测专家| www.lj46.com-中彩彩票网址下载| www.331683.com-乐彩三d字迷| www.424006.com-合买彩票下载安装| www.34816.com-红旗彩票怎么下| www.82753.com-陆慧明竞彩预测| www.456931.com-安徽福彩几点停售| www.59373.cc-爱彩票登录不了| www.158436.com-体彩北单是什么意思| www.157168.com-19040期胜负彩| www.69515.com-赢彩彩票正规吗| www.5841.com-江苏体彩开户银行| 吉利彩票www.80065d.com| www.7176.vip-博彩合法-| www.177579.com-快三奖金是多少| www.388757.com-买彩票图-| www.616360.com-亚彩会游戏官网| www.762883.com-彩娃彩票平台代理| www.942668.com-彩票怎么刷负盈利| www.ns25.com-淘彩网平台是真的吗| www.78858.com-新彩网。-| www.144515.com-正义彩虹志愿者协会| www.853849.com-6合1彩票-| www.72779.cc-竞彩总进球数研究| www.45ql.com-彩票双机店转让| www.4476.cn-七星彩论坛海南彩网| www.36248.com-鑫源彩票网-| www.271163.com-今晚好彩1开奖结果| www.726623.com-内蒙古快三彩票| www.654157.com-广西快三和值| www.688095.com-天天中彩票历史版本| www.60160.com-老尹说彩大乐透分析| www.368.website彩票累计奖池| www.5497.top-福彩诈骗套路| www.05007.com-中彩在线论坛| www.53266.com-有料体育足彩| www.95568.com-彩票奖池分配| www.051323.com-幸福彩票幸运相伴| www.715999.com-福彩3d彩乐乐| www.31663.cc-足球500胜负彩| www.ic55.com-江苏快三免费计划表| www.6rp.com-慧金彩-| www.095369.com-彩票作假吗-| www.67177.cc-阜阳市彩票兑奖中心| www.yy44.com-彩票开奖分析大师| www.53812.cc-横沥东方亮彩怎么样| www.418909.com-彩金项链多少钱一条| www.291253.com-乐彩网l-| www.229305.com-手机彩票app下载| www.3721.vip-购彩xv计划-| www.47593.com-好彩妹天尊-| www.019230.com-瑞彩网app下载| www.393544.com-彩票双色球专家选号| www.44151.com-竞彩娱乐-| www.97744.cc-2m彩票8080c| www.070953.com-彩票365是否正规| 凤凰彩票www.77802p.com| www.804858.com-彩虹的小符号| www.962946.com-江苏省福彩双色球| www.11kl.com-网上购彩软件那个好| www.94993.com-360足球彩票开奖| www.430770.com-江苏彩礼-| www.555020.com-最牛彩票大神| www.639549.com-竞彩申请名额| www.0997.net-中彩擂台赛双色球| www.723747.com-昆山体彩大奖| www.783922.com-航天彩虹股吧| www.857868.com-雪园足彩比分| www.916687.com-永盛国际彩票骗局| www.985826.com-注册送彩金18| www.cp3775.com-幸运快三是什么彩票| www.ja24.com-福彩双色球开奖查询| www.90fq.com-csgo中国博彩| www.39398.cc-全民彩票可以玩吗| www.aj0.com-快三倍投计算器| www.f51.loan-马来西亚网络彩票| www.951947.com-5360彩票主页| 福彩www.26878m.com| www.347498.com-乐福彩票靠谱吗| www.510220.com-彩虹的约定儿歌试听|