高手门,帮忙看看代码哪里错了,折磨我好几天!!!

我用jsp+javascript实现一个简单的折叠式菜单,可是就是子菜单不隐藏,本来应当是我的鼠标放上去之后它就显示里面的子菜单,可是现在它全部显示出来,不隐藏,现在我把代码贴出来,大家帮忙看看,折磨死我了.就一个文件
MyJsp.jsp文件:<%@ page language="java" import="java.util.*" pageEncoding="gbk"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
        
    <title>My JSP 'MyJsp.jsp' starting page</title>
    
<link rel="stylesheet" type="text/css" href="styles.css">

<style type="text/css">
<!--
 .menu a{
  color:#000000;text-decoration:none;
 }
 .menu a:hover{
  text-decoration:underline;
 }
 
 .menuHead{
  font-weight:bold;font-size:larger;background-color:#ff00ff;display:block;
 }
 
 .menuChoices{
  background-color:#00cc00;width:150px;display:block;
 }
 
 #search{
  position:absolute;top:100px;left:10px;width:150px;float:left;
 }
  #search1{
  position:absolute;top:100px;left:160px;width:150px;float:left;
 }
  #search2{
  position:absolute;top:100px;left:310px;width:150px;float:left;
 }


-->


</style>
  </head>
  
  <body>
   <script type="text/javascript">
  <!--
  (document.getElementById()?DOMCapable=true:DOMCapable=false);
   function showover(name){
    if(DOMCapable){
    var themenu=window.document.getElementById(name+"add");
    themenu.style.visibility='visible';
    }
   }
   
    function hiddenover(name){
    if(DOMCapable){
    var themenu=window.document.getElementById(name+"add");
    themenu.style.visibility='hidden';
    }
   }
   
   if(DOMCapable){
    hiddenover("search");
    hiddenover("search1");
    hiddenover("search2");
   }
  -->
  </script>
  
<div　id="search" class="menu" onmouseover="showover('search');" onmouseout="hiddenover('search');">
  <div　class="menuHead">搜索站点</div>
  <div id="searchadd" class="menuChoices">
  <a href="http://www.163.com">163</a>
  <a href="http://www.baidu.com">百度</a>
  <a href="http://www.google.com">谷歌</a>
  <a href="http://www.msn.com">ＭＳＮ</a>
  </div>
 </div><div　id="search1" class="menu" onmouseover="showover('search1');" onmouseout="hiddenover('search1');">
  <div　class="menuHead">电子商务站点</div>
  <div id="search1add" class="menuChoices">
  <a href="http://www.163.com">梅志文</a>
  <a href="http://www.baidu.com">刘平</a>
  <a href="http://www.google.com">毛爷爷</a>
  <a href="http://www.msn.com">毛奶奶</a>
</div></div><div　id="search2" class="menu" onmouseover="showover('search2');" onmouseout="hiddenover('search2');">
  <div　class="menuHead">安全类网站</div>
  <div id="search2add" class="menuChoices">
  <a href="http://www.163.com">梅志坚</a>
  <a href="http://www.baidu.com">梅志全</a>
  <a href="http://www.google.com">梅志国</a>
  <a href="http://www.msn.com">梅志武</a>
  </div>
</div>
  </body>
</html>

解决方案 »

  1.   

    <body onload="init()"> .... function init(){
      hiddenover("search"); 
      hiddenover("search1"); 
      hiddenover("search2"); 
      } 
      

  2.   

    原因是:页面是顺序执行的,当执行到hiddenover("search"); 时,页面的元素<div　id="search"..... 还没有创建,
    我写的是onload="init()"当页面加载完毕后去调用init()方法,这样就不会出现你说的问题了
      

  3.   

    div嵌套的太多了 
    无法获得 改造一下