<ul id="admin">
<li>新闻管理
<ul id="newlist">
<li>列出新闻</li>
<li>增加新闻</li>
<li>查找新闻</li>
<li>删除新闻</li>
</ul>
</li>
<li>公告管理
<ul id="proclaimlist">
<li>列出公告</li>
<li>增加公告</li>
</ul>
</li>
</ul>


请问如何实现默认子项目隐藏,当点击新闻管理或公告管理就列出下面的子项目。
谢谢!

解决方案 »

  1.   


    <ul id="admin"> 
    <li  onmouseover="document.getElementById('newlist').style.display='block';" onmouseout="document.getElementById('newlist').style.display='none';"
    >新闻管理 </li>
    <ul id="newlist" style="display:none;"> 
    <li>列出新闻 </li> 
    <li>增加新闻 </li> 
    <li>查找新闻 </li> 
    <li>删除新闻 </li> 
    </ul> 
    </li> 
    <li  onmouseover="document.getElementById('proclaimlist').style.display='block';" onmouseout="document.getElementById('proclaimlist').style.display='none';"
    >公告管理 </li>
    <ul id="proclaimlist" style="display:none;"> 
    <li>列出公告 </li> 
    <li>增加公告 </li> 
    </ul> 
    </li> 
    </ul> 
    第二个有点小问题,你自己调整一下吧
      

  2.   

    额看错了
    你要的是点击,我用的是mouseover
    反正效果一样
    大不了换成onclick吧
      

  3.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <style>
    #newlist{
    display:none;
    }
    #proclaimlist{
    display:none;
    }
    </style>
    <script>
    function shownw(obj)
    {
    var news=document.getElementById("newlist");
    if(news.style.display=="none")
    {
    news.style.display="block"
    }
    else
    {
    news.style.display="none"
    }
    }
    </script>
    </head><body>
    <ul id="admin" onclick="shownw(this)"> 
    <li>新闻管理
    <ul id="newlist"> 
    <li>列出新闻 </li> 
    <li>增加新闻 </li> 
    <li>查找新闻 </li> 
    <li>删除新闻 </li> 
    </ul> 
    </li> 
    <li>公告管理
    <ul id="proclaimlist"> 
    <li>列出公告 </li> 
    <li>增加公告 </li> 
    </ul> 
    </li> 
    </ul>
    </body>
    </html>