Node1 
<div id="d1"> 
   Child1
   Child2
</div>
Node2
<div id="d2"> 
   Child3
   Child4
</div>Node1.onclick = function{
  document.getElementById('d1').style.display = "block";
  document.getElementById('d2').style.display = "none";
}

解决方案 »

  1.   

    Child1
    Child2 
    是什么意思呢 ?  我试了 我好象弄不了 应该放在那里呢?我的整个JSP内容是这样:希望大家能帮帮谢谢!
    <%@ page language="java" contentType="text/html; charset=gb2312"
        pageEncoding="gb2312"%>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>leftFrame</title>
    <LINK HREF="images/style.css" TYPE="text/css" REL="stylesheet">
    <link rel="stylesheet" href="images/folder.css" type="text/css">
    <link rel="stylesheet" href="images/cm25_style.css" type="text/css">
    <script src="http://mail.tom.com/images/free/js/folder.js"></script>
    <script language="javascript">
    <!--
    var linkHeader = "/cgi/ldapapp?funcid=mails&sid=UABiMrGJUMWACVci&fid=";
    var linkTarget = "main";var linkFdrRoot = "/cgi/ldapapp?funcid=foldmain&sid=UABiMrGJUMWACVci";
    var imagePath="http://mail.tom.com/images/mail3/"var fdrname_root = "根文件夹";
    var fdritems = new Array();
    // leafgif
    var imgsrc_line = imagePath+"l_3_1.gif";
    var imgsrc_midblk = imagePath+"l_4_1.gif";
    var imgsrc_lastblk = imagePath+"l_3_2.gif";var imgsrc_lastplus = imagePath+"l_2_2.gif"; //处于折叠状态, 同一级别的最后一项
    var imgsrc_lastminus = imagePath+"l_2_2.gif"; //处于展开状态, 同一级别的最后一项var imgsrc_midplus = imagePath+"l_2_2.gif";  //处于折叠状态, 不是同一级别的最后一项
    var imgsrc_midminus = imagePath+"l_2_2.gif"; //处于展开状态, 不是同一级别的最后一项var img_open = imagePath+"l_2_2.gif";
    var img_close = imagePath+"l_2_2.gif";var spanstr = "";
    -->
    </script>
    <script type="text/javascript" src="http://mail.tom.com/script/tree.js"></script>
    <script language="javascript">
    // this block define the fdrItems
    var fdritems1 = new Array();fdritems1[0]=new Array(0, '0', '-1', 0, '', '', '7', true, true, true);fdritems1[1]=new Array(1, '1', '0', 1, '生产大楼', '生产大楼', '2', false, true, false);fdritems1[2]=new Array(2, '2', '0', 1, '宿舍大楼', '宿舍大楼', '0', false, false, false);fdritems1[3]=new Array(3, '3', '0', 1, '办公大楼', '办公大楼', '0', false, false, false);fdritems1[4]=new Array(4, '4', '0', 1, '公共设施', '公共设施', '0', false, false, false);</script>
    <script language="javascript">
    <!-- 
    function switchstatus(id){
    var item = document.getElementById(id);
    if (item.style.display=='none'){
    item.style.display = '';
    }else{
    item.style.display = 'none';
    }
    }
    // -->
    </script>
    <script language="javascript">
    <!-- 
    function switchstatus(id){
    var item = document.getElementById(id);
    if (item.style.display=='none'){
    item.style.display = '';
    }else{
    item.style.display = 'none';
    }
    }
    // -->
    </script>
    <script language="JavaScript">
    <!--
    var sid='UABiMrGJUMWACVci';
    //-->
    </script>
            <META http-equiv=expires content=0>
            <META http-equiv=Pragma content=no-cache>
            <META http-equiv=Cache-Control content=No-cache>
            <META http-equiv=Cache-Control content=no-store>
    <script language="JavaScript">
    function showsubmenu(sid)
    {
    var li = document.getElementById("fd"+sid);
    var images = document.getElementById("img"+sid);
    if (li.style.display == 'none'){
    li.style.display = '';
    images.src = "images/ico_arrowtop.gif";
    }else{
    li.style.display = 'none';
    images.src = "images/ico_arrowbot.gif";
    }
    }

    </script>
    </head>
    <body id="htmlbody"  class="body_folder" onunload=adsexit();><!--新建end--><div class="divFolder">
      <div class="" >
        <div class="folder1" onClick="showsubmenu(1);">厂房设施</div>
        <div class="folder20" onClick="showsubmenu(1);">
    <img id="img1" src="images/ico_arrowtop.gif"   title="点击隐藏您的自定义文件夹,再次点击将它展开" >
    </div>
      </div>
       <ul id="fd1" class="ul1" style="display:none">
    <li><img src="images/arrow.gif" /><a href="home1.jsp" target="mainFrame" >生产大楼</a></li>
    <li><img src="images/arrow.gif" /><a href="home2.jsp" target="mainFrame" >员工宿舍</a></li>
    <li><img src="images/arrow.gif" /><a href="home3.jsp" target="mainFrame" >行政大楼</a></li>
    <li><img src="images/arrow.gif" /><a href="home4.jsp" target="mainFrame" >公共设施</a></li>
    </ul>
     </div>
     <div class="divFolder1">
      <div class="" >
        <div class="folder1" onClick="showsubmenu(2);" >产品及服务</div>
    <div class="folder20" onClick="showsubmenu(2);" >
    <img id="img2" src="images/ico_arrowtop.gif"   title="点击隐藏您的自定义文件夹,再次点击将它展开" >
    </div>
        <!--div class="folder2" onClick="showsubmenu(2);" ></div-->
      </div>
       <ul id="fd2" class="ul1" style="display:none">
    <li><img src="images/arrow.gif" /><a href="show.jsp"  target="mainFrame" >产品展示</a></li>
    <!-- <li><a href="buyer.jsp" target="mainFrame" >服务向导</a></li> -->
    </ul>
    </div>
    <div class="divFolder1">
      <div class="" >
        <div class="folder1" onClick="showsubmenu(3);" >本厂设备</div>
    <div class="folder20" onClick="showsubmenu(3);" >
    <img id="img3" src="images/ico_arrowtop.gif"   title="点击隐藏您的自定义文件夹,再次点击将它展开" >
    </div>
      </div>
       <ul id="fd3" class="ul1" style="display:none">
    <li><img src="images/arrow.gif" /><a href="webaddress.jsp"  target="mainFrame" >生产设备</a></li>
    <li><img src="images/arrow.gif" /><a href="qa.jsp" target="mainFrame" >品质检定</a></li>
        <li><img src="images/arrow.gif" /><a href="warehouse.jsp"  target="mainFrame" >产品储存</a></li>
    </ul>
    </div>
    <div class="divFolder1">
      
        <div class="folder1" onClick="showsubmenu(4);" >员工福利</div>
    <div class="folder20" onClick="showsubmenu(4);" >
    <img id="img4" src="images/ico_arrowtop.gif"   title="点击隐藏您的自定义文件夹,再次点击将它展开" >

      </div>
       <ul id="fd4" class="ul1" style="display:none">
    <li><img src="images/arrow.gif" /><a href="life.jsp"  target="mainFrame" >日常生活</a></li>
    <li><img src="images/arrow.gif" /><a href="tu_1.jsp"  target="mainFrame" >每月活动</a></li>
        <li><img src="images/arrow.gif" /><a href="tu_2.jsp"  target="mainFrame" >员工培训</a></li>
    </ul>
    </div>
    <div class="divFolder1">
      <div class="" >
        <div class="folder1">
    <a href="index-3.jsp" target="mainFrame" class="black"><font color="#ffffff">关于我们</font></a></div>
      </div>
    <div class="divFolder1">
      <div class="" >
        <div class="folder1">
    <a href="keep.jsp" target="mainFrame" class="black"><font color="#ffffff">联系我们</font></a></div>
      </div>
      
        <script language="JavaScript1.2">if (document.all){
      var nodelength=fd1.length-1
      var nodes=new Array(nodelength)
      var openones=''
    }
    if (document.all){
      var nodelength=fd2.length-1
      var nodes=new Array(nodelength)
      var openones=''
    }
    if (document.all){
      var nodelength=fd3.length-1
      var nodes=new Array(nodelength)
      var openones=''
    }
    if (document.all){
      var nodelength=fd4.length-1
      var nodes=new Array(nodelength)
      var openones=''
    }
    function check(){
      for (i=0 ; i <= nodelength ; i++){
        if (fd1[i].style.display=='')
           openones=openones + " " + i
      }
      document.cookie=window.location.pathname+"="+openones
    }
    function check(){
      for (i=0 ; i <= nodelength ; i++){
        if (fd2[i].style.display=='')
           openones=openones + " " + i
      }
      document.cookie=window.location.pathname+"="+openones
    }
    function check(){
      for (i=0 ; i <= nodelength ; i++){
        if (fd3[i].style.display=='')
           openones=openones + " " + i
      }
      document.cookie=window.location.pathname+"="+openones
    }
    function check(){
      for (i=0 ; i <= nodelength ; i++){
        if (fd4[i].style.display=='')
           openones=openones + " " + i
      }
      document.cookie=window.location.pathname+"="+openones
    }
    if (document.all)
      document.body.onunload=check
    //-->
    </script>
    </body>
    </html>
      

  2.   

    网上有一个组件可以满足你的要求 组件名为:dTree