81,094
社区成员
发帖
与我相关
我的任务
分享动态菜单是怎么实现的？
菜单内容从数据库中读取。。
数据库表如下
ID Name URL
1 1级菜单 1
11 1.1级菜单 1.1
12 1.2级菜单 1.2
13 1.3级菜单 1.3
2 2级菜单 2
21 2.1级菜单 2.1
22 2.2级菜单 2.2
3 3级菜单 3
31 3.1级菜单 3.1
32 3.2级菜单 3.2
怎么读到目录型的菜单中
菜单代码如下
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>3</title>
<style>
body{font-family:"宋体";font-size:14.7px;margin:1% 20%;padding:12px 30px;}
div{cursor:hand;padding-}
li{width:70px;border-left:1px solid black;padding:0;font-size:12px;margin:0 6px;list-style-type:none;border-bottom:1px dashed red;}
#main{margin:0}
</style>
<script language="javascript" type="text/javascript">
<!--
function menu(aa,bb){
if(aa.style.display=="none"){
d01.style.display="none";
d11.style.display="none";
d21.style.display="none";
d31.style.display="none";
aa.style.display="";
d00.src="http://www.1studio.net/html/example/0054/close.gif";
d10.src="http://www.1studio.net/html/example/0054/close.gif";
d20.src="http://www.1studio.net/html/example/0054/close.gif";
d30.src="http://www.1studio.net/html/example/0054/close.gif";
bb.src="http://www.1studio.net/html/example/0054/open.gif";
}
else
{
aa.style.display="none";
bb.src="http://www.1studio.net/html/example/0054/close.gif";
}
}
//-->
</script>
</head>
<body>
<div id="d0" onclick="menu(d01,d00)"><img name="d00" src="http://www.1studio.net/html/example/0054/close.gif"/> 链接0</div>
<div id="d01" style="display:none">
<li><a href="#">- 子目录1</a></li>
<li><a href="#">- 子目录2</a></li>
<li><a href="#">- 子目录3</a></li>
<li><a href="#">- 子目录4</a></li>
</div>
<div id="d1" onclick="menu(d11,d10)"><img name="d10"src="http://www.1studio.net/html/example/0054/close.gif"/> 链接一 </div>
<div id="d11" style="display:none">
<li><a href="#">- 子目录1</a></li>
<li><a href="#">- 子目录2</a></li>
<li><a href="#">- 子目录3</a></li>
<li><a href="#">- 子目录4</a></li>
</div>
<div id="d2" onclick="menu(d21,d20)">
<img name="d20" src="http://www.1studio.net/html/example/0054/close.gif"/> 链接二</div>
<div id="d21" style="display:none">
<li><a href="#">- 子目录1</a></li>
<li><a href="#">- 子目录2</a></li>
<li><a href="#">- 子目录3</a></li>
<li><a href="#">- 子目录4</a></li> </div>
<div id="d3" onclick="menu(d31,d30)">
<img name="d30" src="http://www.1studio.net/html/example/0054/close.gif"/> 链接三</div>
<div id="d31" style="display:none">
<li><a href="#">- 子目录1</a></li>
<li><a href="#">- 子目录2</a></li>
<li><a href="#">- 子目录3</a></li>
<li><a href="#">- 子目录4</a></li>
</div>
</body>
数据库表如下
ID Name URL
1 1级菜单 1
11 1.1级菜单 1.1
12 1.2级菜单 1.2
13 1.3级菜单 1.3
2 2级菜单 2
21 2.1级菜单 2.1
22 2.2级菜单 2.2
3 3级菜单 3
31 3.1级菜单 3.1
32 3.2级菜单 3.2
怎么读到目录型的菜单中
菜单代码如下
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>3</title>
<style>
body{font-family:"宋体";font-size:14.7px;margin:1% 20%;padding:12px 30px;}
div{cursor:hand;padding-}
li{width:70px;border-left:1px solid black;padding:0;font-size:12px;margin:0 6px;list-style-type:none;border-bottom:1px dashed red;}
#main{margin:0}
</style>
<script language="javascript" type="text/javascript">
<!--
function menu(aa,bb){
if(aa.style.display=="none"){
d01.style.display="none";
d11.style.display="none";
d21.style.display="none";
d31.style.display="none";
aa.style.display="";
d00.src="http://www.1studio.net/html/example/0054/close.gif";
d10.src="http://www.1studio.net/html/example/0054/close.gif";
d20.src="http://www.1studio.net/html/example/0054/close.gif";
d30.src="http://www.1studio.net/html/example/0054/close.gif";
bb.src="http://www.1studio.net/html/example/0054/open.gif";
}
else
{
aa.style.display="none";
bb.src="http://www.1studio.net/html/example/0054/close.gif";
}
}
//-->
</script>
</head>
<body>
<div id="d0" onclick="menu(d01,d00)"><img name="d00" src="http://www.1studio.net/html/example/0054/close.gif"/> 链接0</div>
<div id="d01" style="display:none">
<li><a href="#">- 子目录1</a></li>
<li><a href="#">- 子目录2</a></li>
<li><a href="#">- 子目录3</a></li>
<li><a href="#">- 子目录4</a></li>
</div>
<div id="d1" onclick="menu(d11,d10)"><img name="d10"src="http://www.1studio.net/html/example/0054/close.gif"/> 链接一 </div>
<div id="d11" style="display:none">
<li><a href="#">- 子目录1</a></li>
<li><a href="#">- 子目录2</a></li>
<li><a href="#">- 子目录3</a></li>
<li><a href="#">- 子目录4</a></li>
</div>
<div id="d2" onclick="menu(d21,d20)">
<img name="d20" src="http://www.1studio.net/html/example/0054/close.gif"/> 链接二</div>
<div id="d21" style="display:none">
<li><a href="#">- 子目录1</a></li>
<li><a href="#">- 子目录2</a></li>
<li><a href="#">- 子目录3</a></li>
<li><a href="#">- 子目录4</a></li> </div>
<div id="d3" onclick="menu(d31,d30)">
<img name="d30" src="http://www.1studio.net/html/example/0054/close.gif"/> 链接三</div>
<div id="d31" style="display:none">
<li><a href="#">- 子目录1</a></li>
<li><a href="#">- 子目录2</a></li>
<li><a href="#">- 子目录3</a></li>
<li><a href="#">- 子目录4</a></li>
</div>
</body>
...全文
请发表友善的回复…
发表回复
