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.563815.com-七乐彩谜语-| www.684998.com-福彩3d校验码| www.31tx.com-聚星彩票客户端下载| www.10mb.com-福彩今天关注金码| www.7571.win-家彩论坛3d预测| www.74450.com-中超联赛竞彩| www.088739.com-云南时时彩开奖漏洞| www.756803.com-福彩软件大全| www.019461.com-福彩投注订单助手| www.208488.com-腾讯5分彩走势| www.0501.wang-3d福彩图吧-| www.274631.com-快三二不同号技巧| www.631119.com-汇彩网主页| www.199589.com-体育彩票的骗局| www.353922.com-中福彩票是什么| www.71493.com-河南省福彩中心位置| www.290838.com-合肥福彩中心地址| www.63395.cc-彩票国际365购彩| www.1oa.com-合肥阜南路体彩店| www.125740.com-腾讯3分彩是什么| www.673293.com-福彩3d什么时候开| www.909207.com-福彩b今天试机询| www.789460.com-中国竞彩网手机| www.53993.com-內蒙时时彩开奖结果| www.707687.com-快三线上娱乐| www.ye63.com-35期彩票开奖结果| www.1674.pw-信誉较好的私彩平台| www.250050.com-冀彩宝官网下载安装| www.747368.com-88彩票预测-| www.im7.com-大赢家彩票app| www.8456.pw-彩票站软件下载| www.620486.com-美国28彩票网| www.333.org-魔方彩票国王皇后| www.413626.com-足彩培训-| www.700921.com-网站买彩票犯法吗| www.894810.com-彩票助赢网页版| 大赢家彩票平台www.507283.com| www.ro56.com-盈彩网什么平台| www.53zf.com-贵阳有人中过彩票嘛| www.2301.org-天下好彩免费大全| www.78379.com-竞彩足球加奖app| www.069630.com-神彩福牛下载| www.155010.com-足彩拉力理论解释| www.259055.com-足彩妖刀-| www.368504.com-体彩6?1开奖| www.529135.com-87彩店网页版| www.71mh.com-关于彩票的名言| www.860772.com-湖南福彩网开奖查询| www.7092.shop-宁夏七彩艺校| www.706383.com-北京福彩论坛去哪儿| www.792237.com-彩票可叫折过| www.874179.com-彩票app无法提现| www.957306.com-爱彩乐账号-| 爱购彩票www.203552.com| www.456633.com-足彩代理狗-| www.85779.com-高频彩票网址| www.780726.com-彩铅手绘花朵| www.946066.com-郑州彩礼-| 彩69www.096610.com| www.k42.cc-今天3d彩民乐图| www.85hm.com-飞彩网-| www.6516.com-怎么样开彩票店| www.91956.com-广东彩王第32期| www.115307.com-彩铅落日的风景画| www.237431.com-福彩七乐彩| www.396199.com-釉上彩餐具有毒吗| www.617305.com-延吉市彩票站| www.182089.com-极速快三彩票平台| www.545917.com-福彩投注站申请电话| www.6593.org-邪恶帝国全彩| www.95027.cc-福彩内部人员免费| www.703663.com-北京快三怎么赌| www.967245.com-彩吧3d走势图电脑| www.f64.pw-海南私彩4位取码| www.3288.mobi-五分彩万位定胆公式| www.74517.com-七乐彩7等奖多少钱| www.212931.com-博彩app平台| www.501325.com-必发彩票客户端下载| www.lr50.com-福彩网络快三| www.022637.com-福彩3d天下无敌1| www.63258.com-彩宝彩票安卓版下载| www.090813.com-刚力彩芽比基尼| www.483246.com-什么是刷彩票流水| www.789257.com-福彩双色球中奖真假| www.hh65.com-广东体彩中心| www.35rw.com-七星彩走势图综合| www.ga88.com-快乐彩12选5直播| www.fy87.com-英国3分彩-| www.584577.com-打击外围彩票黑庄| www.398908.com-3d彩界王子双胆| www.670631.com-内蒙古彩票中奖事件| www.863234.com-足彩19050期| www.830567.cc-印象彩票手机客户端| www.1358.net-彩运来官方最新登录| www.30157.cc-彩8网站是不是真的| www.86504.com-查询福彩体彩软件| www.121295.com-彩票计划自动发群| www.225328.com-福彩快三有规律吗| www.129170.com-彩虹旗泡弟手机版| www.85055.cc-体彩北京十一选五| www.995645.com-今日足球竞彩单场| www.j53.net-贵州黔西县中彩票| www.ym91.com-体彩阿四荐号| www.316592.com-乐彩网双色球论坛| www.102026.com-九场足彩开奖结果| www.770053.com-恒大国际福彩| www.685603.com-江苏快3彩控网| www.409711.com-够力七星彩安卓下载| www.829876.com-28号彩票-| www.911670.com-怎么快速学会看彩票| www.973098.com-七彩玫瑰永生花| www.mu6.com-广西福彩下载安装| www.86wb.com-新加坡乐和彩开| www.33939.cc-足球彩票分析师招聘| www.793699.com-网上购彩算不算赌博| www.v66.com-体彩和值尾走势| www.164.bid-神州娱乐彩-| www.618138.com-500彩票账号注册| www.7121.cm-七彩孔雀釉建盏介绍| www.51871.com-福彩3d跨度振幅表| www.15fk.com-福利彩票3试机号| www.676519.com-好运来大发快三| www.796713.com-彩票追号万能计算器| www.024268.com-福彩了d走势图| www.166506.com-快三平台网站| www.330717.com-河北福彩网3d快3| www.680729.com-男子买彩票倾家荡产| www.785621.com-彩票3d数据分析| www.926579.com-瑞彩网是正规平台吗| www.cd65.com-刷彩票赚钱是真的吗| www.xw03.com-ios正规彩票软件| www.23da.com-22彩票官网ios| www.676381.com-进口彩妆代理商| www.177120.com-百盈快三害了多少人| www.331171.com-新浪彩票走势图预测| www.550640.com-沈丘彩票-| www.761924.com-算局七星彩奖表划规| www.ic41.com-快三彩票群-| www.753152.com-中华彩吧的网站| www.355150.com-买彩票二等奖多少钱| www.460787.com-彩民乐大乐透字谜图| www.562588.com-南方花园枫彩园房价| www.786066.com-福彩大赢家论坛| www.265635.com-吉林快三出号| www.587595.com-万彩吧和彩期期准| www.536017.com-体彩店网名-| www.599540.com-彩票奖金超过一万| www.657467.com-乐彩神注册-| www.718388.com-聚彩官网是合法的吗| www.789140.cc-胜负彩最新对阵表| www.856394.com-海南七星彩预测软件| www.910855.com-篮彩比分网-| www.965407.com-97彩票app-| 大赢家彩票www.602927.com| www.019586.com-云南体彩网开奖公告| www.157678.com-足彩买胜负怎么样| www.300978.com-白菜免费送彩金| www.636685.com-彩虹台网络电视直播| www.903004.com-福福利彩票双色球| www.4730.com-亿彩票买球靠谱吗| www.23293.cc-福彩3的-| www.898835.com-甘肃快三派奖最新| www.64vr.com-足彩推荐微信公众号| www.539052.com-微投彩票平台|