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.026688.com-辉煌团队彩票| www.810196.com-竞彩足球打法推荐| www.899853.com-官方网络售彩| www.972241.com-买彩员-| www.cp1110.com-湖北快三网页计划| www.nj00.com-比分彩客-| www.21.black-体彩排列三讨论区| www.961146.com-一定牛彩票网预测| www.cai5535.com甘肃快三连线走势图| www.676342.com-明天彩票号是多少| www.5499.net-开个彩票店怎么加盟| www.3349.cc-中彩股哈市-| www.778790.com-速彩通app-| www.898905.com-快三网上赚钱| www.761285.com-体育彩票排三开机号| www.886614.com-民彩网下载-| www.767572.com-福彩3d蜂巢图| www.970421.com-天天乐彩下载| www.bg47.com-重庆快三走势图| www.805998.com-彩票是否是骗局吗| www.890354.com-彩票正规平台在哪找| www.969155.com-福彩公益金分配问题| www.cp403.com-大发快三哪里下载| www.368082.com-刚力彩芽写真| www.547705.com-彩票七乐彩走势图| www.252827.com-重庆老时时彩走势图| www.578509.com-兰州福利彩票中心| www.811093.com-网上买快三规律| www.297071.com-时时彩口诀大全图| www.366880.com-吉林市黑彩快三| www.529139.com-亿彩是什么-| www.860924.com-今天七乐彩开奖号码| www.971409.com-彩票分析基础答案| www.cp3357.com-1分快3是什么彩票| www.2920.vip-兰州福利彩票中心| www.91326.com-欧盟好彩蓝莓单爆| 福彩www.16878o.com| www.55mv.com-福利彩票租赁平台| www.23599.com-新二彩票骗局| www.276010.com-福建体彩31选7| www.198924.com-快乐彩票app下载| www.ps65.com-三分彩是什么| www.82wg.com-时时彩专家乐彩网| www.338166.com-福彩和值技巧大全| www.00304.com-快三和值与跨度表| www.891.live-彩铅画人物教程图片| www.586044.com-能赢钱的彩票网站| www.698949.com-华夏彩票网站首页| www.060051.com-如何报复黑彩平台| www.42211.cc-彩12彩票坑人| www.001800.com-双色球彩托真实故事| www.095028.com-1688彩吧官方群| www.526302.com-民政部福彩中心改革| www.596069.com-男子中彩票后打老板| www.663375.com-下载安徽福彩网| www.737709.com-玩彩送彩金的网站| www.559107.com-下载内蒙体彩| www.134168.com-淘淘彩票app| www.43zo.com-精彩的精的意思| www.217081.com-彩票指南报纸手机版| www.872748.com-彩票随机数字规律| www.977513.com-合法的彩票app| www.hy65.com-河北燕赵福彩网官网| www.299508.com-中国体彩开奖信息| www.110281.com-鸿运彩票网计划| www.899509.com-湖北福利彩票申请| www.123343.com-乐彩3d交流-| www.205619.com-大发快三稳赚计划| www.120353.com-五和彩下载-| www.298680.com-彩票开奖结果全部| www.237079.com-全能中彩彩票| www.131446.com-新郑彩礼多少| www.316060.com-如何开好体彩店| www.388398.com-心同彩票平台| www.160755.com-神州风采彩票靠谱吗| www.310161.com-湖北福彩官网| www.371044.com-826彩票软件下载| www.456351.com-兖州福彩中心民政局| www.554007.com-晨兴彩票骗你| www.624665.com-5d漫画全彩无| www.701196.com-下载中国福彩网| www.799710.com-体彩开奖今天| www.806633.com-竞彩单注奖金限额| www.v80.net-拉萨有买彩票的吗| www.90vo.com-王者彩票团队计划| www.809193.com-彩客手机官网| www.905172.com-合肥体彩店能转让吗| www.969980.com-还有人买福彩吗| 吉彩www.407872.com| www.898773.com-买彩票哪个软件正规| www.970480.com-分分彩胆码技巧| www.cai771.cc-快三技巧顺口溜| www.is04.com-今日足彩推荐预测| www.c14.space-快三怎么买容易中奖| www.503983.com-走台和彩排的区别| www.061063.com-天天爱彩票无法提现| www.319000.com-外围彩票合法网站| www.401336.com-uk彩官网-| www.509228.com-七星彩大奖-| www.13xv.com-找个最可信的彩票网| www.336067.com-有正规的福彩快三吗| www.448330.com-3d分分彩-| www.547687.com-彩票时间差套利| www.656572.com-2018年彩票大奖| www.744252.com-兴华彩票靠谱吗| www.890165.com-篮球彩票258| www.980088.com-竞彩胜平负开奖结果| www.sn0.cc-3d彩票规则-| www.ps21.cc-鸿彩网-| www.0gg.cc-乐福彩票是什么| www.62qt.com-快乐彩规则和奖金| www.3uv.cc-网上京彩平台正规吗| www.319044.com-江西快三开奖爱彩乐| www.700033.cc-福利彩票的打法| www.01216.com-智赢竞彩触屏版| www.583079.com-彩票动态图片| www.540062.com-古风女背影彩铅画| www.003803.com-竟球彩-| www.693137.com-周银鹤测彩票的博客| www.787628.com-智慧彩挂机软件下载| www.874026.com-极速快三开奖走势| www.944834.com-体彩排三遗漏一定牛| 九九集团www.99jtc.com| www.ih85.com-中国体彩竞彩网| www.05bk.com-彩铅颜色叠加不上| www.396721.com-体彩3走势-| www.039950.com-足彩2串1中一场| www.8523.loan-香港668彩票下载| www.33269.cc-如何开设彩票网站| 博友彩www.412688.com| www.42fu.com-破重庆时时彩规律| www.1009.win-各彩种开奖时间| www.133089.com-快三输了很多能回血| www.581365.com-k彩客服-| www.296669.com-彩专家大牛在线计划| www.690930.com-大发一分钟快三技巧| www.767728.com-足球e球彩中奖规则| www.5yh.cc-腾讯分分彩平台春秋| www.94mz.com-最大的彩票中奖| www.54uk.com-3d福彩南方双彩网| www.95252.cc-彩票内部人员骗局| www.10dh.com-彩生活物业投诉电话| www.301615.com-c8万彩吧cn-| www.320950.com-明发彩票网址| www.13nt.com-今日七乐彩开奖号| www.024761.com-安徽快三三同号单选| www.172178.com-湖北彩票-| www.383010.com-网易彩票机选双色球| www.557766.com-彩票彩宝贝预测汇总| www.699580.com-上海福彩双色球开奖| www.840538.com-足彩赔率概率计算| www.m37.club-快三哪个平台正规呀| www.1364.net-网站彩票是真是假| www.9819.pw-江西福彩3不同| www.90858.cc-体育彩票三位数开奖| 500彩票www.26299z.com| www.438506.com-乐亿彩票乐逸报| www.522903.com-如何看待彩票套彩| www.760523.com-乐透型彩票中奖技巧| www.847896.com-彩票助赢官网| www.962608.com-富贵彩官网-| www.cai1922.com时时彩5星走势图| www.we28.com-下载广西福彩网| 大赢家彩票平台www.763829.com|