请教Div+CSS+JS树型菜单问题,我是新手，

html-css019

请教Div+CSS+JS树型菜单问题,我是新手，,第1张

不太明白你描述的问题......点击里面的1或2或3,不是你设置了链接么?都跳转了,还有什么隐藏不隐藏?? 你是不是想说 点11显示11的子菜单,点12显示12的子菜单,其它(11和13)的隐藏?

如果是这个效果,你有两个错误:

1:你最大的那个无序列表<ul>少了 闭合标签,即</ul>,你自己检查一下.

2:在css里加.collapsed{display:none}

如果不是,就不清楚了..............................

前几天用非常规方法实现了一个山寨版树形菜单。。。如下。。。<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title></title>

<meta http-equiv="pragma" content="no-cache">

<meta http-equiv="cache-control" content="no-cache">

<meta http-equiv="expires" content="0">

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="This is my page">

<script type="text/javascript">

function display(jia,zi) {

if(document.getElementById(jia).innerHTML== '+'){

document.getElementById(zi).style.display=""

document.getElementById(jia).innerHTML= '-'

return

}

if(document.getElementById(jia).innerHTML== '-'){

document.getElementById(zi).style.display= 'none'

document.getElementById(jia).innerHTML= '+'

return

}

}

function exit(){

//window.location.href='../ht.jsp'

//alert('您已安全退出')

}

</script>

<style type="text/css">

.juli{margin-top:20px<br> border:none<br> }

.neijuli{

padding-top:8px

line-height:1.5em

font-size:23px

}

.fuhao { border:1px solid white

color:#FFFFFF

}

body {

background-color: #7A99E0

font-size:25px

}

.txtc{color:#FFFFFF}

.smalltxt{font-size:17px}

a{text-decoration:none}

</style> </head>

<body>

<div class="smalltxt txtc" style="margin-bottom:30px">

系统后台管理面板

</div><!--开始部分===================================== -->

<span class="smalltxt txtc"><a href="admin/loginout.jsp" target="_top" style="color:white">[安全退出]</a> <a href="index.jsp" style="color:white" target="_top">[返回首页]</a></span><!-- 商品管理开始================================ -->

<div id="sp" name="sp" class="juli">

<span id="jia" class="fuhao" >+</span>

<a style="cursor:hand" onClick="display('jia','zi')" class="txtc">商品管理</a>

<!-- 子菜单 -->

<div id="zi" name="zi" class="neijuli" style="display:none">

<a href="admin/addpro.jsp" target="mainFrame">添加商品</a><br>

<a href="admin/controlpro.jsp" target="mainFrame">管理商品</a>

</div>

</div>

<hr class="txtc"><!--新闻管理开始================================= -->

<div id="xw" name="xw" class="juli" >

<span id="jia1" class="fuhao">+</span>

<a style="cursor:hand" onClick="display('jia1','zi1')" class="txtc">新闻管理</a>

<!-- 子菜单 -->

<div id="zi1" class="neijuli" style="display:none">

<a href="admin/addnews.jsp" target="mainFrame">添加新闻</a><br>

<a href="admin/controlnews.jsp" target="mainFrame">管理新闻</a>

</div>

</div>

<hr class="txtc"><!--留言管理开始================================== -->

<div id="ly" name="ly" class="juli">

<span id="jia2" class="fuhao">+</span>

<a style="cursor:hand" onClick="display('jia2','zi2')" class="txtc">系统管理</a>

<!-- 子菜单 -->

<div id="zi2" class="neijuli" style="display:none">

<a href="#">关闭系统</a><br>

<a href="#">XXX</a>

</div>

</div>

<hr class="txtc">

</body>

</html>