<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>json数据创建多级下拉菜单 - 【更多源码：www.96flw.com】</title>
<!--页面布局，可忽略！-->
<link rel="stylesheet" type="text/css" href="css/m-base.css" />
<!--左侧导航样式-->
<link rel="stylesheet" type="text/css" href="css/LeftNav.css">
<style type="text/css">
html,
body {
height: 100%;
}
.left {
height:100%;
}
</style>
</head>
<body>
<div class="left"></div>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/LeftNav.js" type="text/javascript"></script>
<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>
<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：IE8、360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗.</p>
<p>更多源码：<a href="http://www.96flw.com/" target="_blank">www.96flw.com</a></p>
</div>
</body>
</html>
