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.ky17.com-彩票99手机版下载| www.037060.com-有那些彩票软件| www.842068.com-福利彩票站门面图| www.189794.com-江苏乐彩快三| www.305935.com-彩6官网下载ios| www.567100.com-彩虹台手机直播在线| www.nq66.com-河南福彩自助机| www.43na.com-竞彩6串50计算器| www.884933.com-彩神网合法吗| www.6676.hk-荔浦的彩调-| www.341377.com-柳州快三末班车几点| www.497318.com-500彩票做任务| www.575758.com-足彩竞彩世界杯| www.661861.com-竞彩徐州店-| www.752285.com-天福彩票平台| www.825619.com-山西快三54期查询| www.909328.com-福彩3d第三版彩吧| www.986451.com-彩票的漏洞-| www.227599.com-go彩-| www.7887.loan-体体彩排列五试机号| www.417614.com-快三模拟摇奖器| www.405.org-彩票五行取数法| www.9048.xyz-七星彩18139期| www.759479.com-五和彩开奖结果查询| www.885062.com-快彩安卓下载| www.958343.com-福彩3d代码是什么| 开心彩票www.361706.com| www.js43.com-五百彩票app| www.678277.com-彩票种类大全图片| www.122271.com-彩民论坛74849| www.770713.com-昌平水屯彩票站杀人| www.225961.com-天天中彩票网络骗局| www.556679.com-七乐彩开奖| www.048551.com-精英彩票6lcc| www.6520.org-彩票自动挂机平台| www.34795.com-广西快三方法和技巧| www.198180.com-福彩走势图带连线图| www.479321.com-竞彩足球7-| www.612211.com-有关彩票的书| www.708258.com-网络彩票2019| www.811531.com-彩票高频走势| www.917258.com-去哪里举报网上彩票| www.998240.com-七星彩资料早版牛爹| www.kr08.com-山东快三开奖结果| www.15rh.com-双色球彩报图片| www.426813.com-职业彩民心得故事| www.485645.com-飞彩网是做什么的| www.763129.com-缅甸时时彩是真的吗| www.748618.com-一分赛车彩票技巧| www.42802.com-送彩金28-| www.556971.com-国家禁止网上买彩票| www.19rc.com-彩票一直买一个号| www.557253.com-网络博彩推广犯法吗| www.639826.com-香港开彩现场直播| www.733465.com-体彩时时彩走势图| www.801786.com-大钱庄彩票下载安装| www.889026.com-彩票斩龙-| www.985348.com-足球竞彩数据app| www.bh2.com-湖北精彩十分3d| www.048967.com-私人彩票破解| www.169698.com-彩票入门基础知识| www.019355.com-双色球中奖彩票真图| www.129142.com-陕西福彩双色球玩法| www.238322.com-发彩网是真的吗| www.622622.cc-黑苍蝇3d彩报图| www.738953.com-福彩彩票高手交流群| www.662025.com-体彩竞彩大奖| www.805099.com-七乐彩中奖条件| www.904290.com-手机购彩大发快三| www.979331.com-福彩开奖结果是多少| www.fr83.com-发彩网官方网站| www.430600.com-彩沙涂料-| www.723205.com-常州市福彩中心地址| www.116841.com-燕赵福利彩票快3| www.79657.cc-宁夏福彩官网| www.721422.com-彩票自动跟投软件| www.22ii.com-盈盈彩是骗人的吗| www.62881.cc-彩经网排三定胆推荐| www.56670.com-时时彩后三一码破解| www.408333.com-中国体彩票大乐透| www.3586.vip-新mg送彩金-| www.9350.top-什么彩票中的几率大| www.53215.cc-足球竞彩软件哪个好| www.yj25.com-正规网络彩票平台| www.829211.com-彩net-| www.gs02.com-093彩票网址| www.14xe.com-山东福彩山东体彩| www.659773.com-明发彩票怎么样| www.774320.com-3分彩分分彩开奖| www.717657.com-彩铅桃花树-| www.ey09.com-快三怎么投注稳赚| www.66757.com-离我附近的彩票站| www.ml01.com-78彩票app下载| www.587840.com-足球任九购彩| www.0654.vip-彩票收益计算| www.990007.com-4个数字的彩票| www.ry47.com-31彩平台-| www.81151.com-体彩即开型彩票骗局| www.108907.com-彩票模型概率论| www.525317.com-澳门博彩在线| www.621365.cc-福彩夺宝连连看破解| www.698413.com-彩票倍投不可取| www.770963.com-安康福彩加盟| www.838396.com-江苏多乐彩-| www.892978.com-快三三不同号通选| www.956683.com-错打彩票赔钱| 500万彩票www.39500p.com| www.ci25.com-银川快三开奖| www.964260.com-彩票数字筛选软件| www.lm57.com-今日中彩官网| www.b98.club-七星彩大奖软件| www.7220.cm-七星彩开奖结果一一| www.357145.com-河北沧州双彩店转让| 凤凰彩票www.77803w.com| www.594896.com-跑得快三人-| www.832465.com-七彩视界官网页面| www.911552.com-开体彩店费用| www.985593.com-竞彩篮球必发交易量| www.ca16.com-湖北快三前天走势图| www.xe97.com-七星彩2254-| www.09bd.com-星辉彩票-| www.579848.com-月夜飞龙体彩预测| www.655639.com-手机在线彩票下载| www.722951.com-3d试机号凤彩| www.783701.com-购彩网06-| www.867262.com-七星彩守号20年| www.921226.com-3d福彩跨度和制图| www.970146.com-威力彩開獎-| 网易彩票www.36788s.com| www.oq23.com-盈彩-| www.85bk.com-彩93可靠吗-| www.563928.com-河北体彩竟彩网| www.616303.com-竞彩3串2几场容错| www.668577.com-华人时时彩票| www.727939.com-西安市福利彩票| www.783068.com-内蒙古彩票重奖查询| www.860475.com-江苏体彩排列三走势| www.906793.com-福利彩快8怎么下载| www.cm42.com-福彩3怎么玩儿| www.85876.com-彩凃钢板-| www.026683.com-h辉煌彩票-| www.085131.com-今日福彩相年富| www.154110.com-博雅彩票手机版| www.252261.com-甘肃快三开奖结果| www.871416.com-福彩藏机图今天破解| www.963942.com-彩虹是什么意思污词| 金冠彩票www.49956y.com| www.737639.com-中国福利彩票宗旨| www.974702.com-四川省体彩中心官网| www.qi4.com-马来西亚乐和彩开奖| www.nj25.com-竞彩蓝球360| www.00oy.com-赞美彩虹的诗句李白| www.760047.com-3d彩神论坛-| 彩客博www.8667k.com| www.964893.com-18彩票官方下载| www.ph0.com-亚博足彩app| www.rz86.com-手机怎么买彩票| www.3tx.com-中彩网号码分析| www.037754.com-爱投网购彩app| www.58du.cc-中彩那天短文理解| www.2128.tv-乐彩三地字谜| www.911099.com-安徽快三最新预测| 百姓彩票www.www.bxcp3333.com| www.07xj.cc-彩芽的天真好奇心|