100分在线等 table里面的树状显示

要点击某行的时候隐藏该行下面的子节点
类似csdn的
树状的结构

解决方案 »

  1.   

    <script language="javascript">
      function showDiv() 
      { 
        document.getElementById('div_1').style.display = 'none'; 
        document.getElementById('div_2').style.display = 'none'; 
      } 
    </script>
    <TABLE border> 
    <tbody id = 'div_1' > 
    <TR onclick = 'showDiv()' > 
    <TD>a </TD> 
    </TR> 
    <tbody id = 'div_2' > 
    <TR> 
    <TD>aa </TD> 
    </TR> 
    </tbody> 
    </tbody> <tbody id = 'div_3' > 
    <TR> 
    <TD>b </TD> 
    </TR> 
    </tbody> </TABLE> 
      

  2.   

    3搂你吧我想的也太菜了点吧。点击某个节点 就是某个tr的时候，隐藏它的子tr
      

  3.   

    http://country.lvyou168.cn/flashwariii/tree/这里有一棵，下载去这里下http://country.lvyou168.cn/flashwariii/download.htm
      

  4.   

    <TABLE border> 
    <TR onclick = 'showDiv()' > 
        <TD>a </TD><td>d</td>
    </TR>
    <div id = 'div_1'>
        //这个tr 属于 上面一个tr的子tr 
        <TR> 
            <TD>aa </TD><td>dd</td>
        </TR> 
    <div><TR> 
        <TD>b </TD> 
    </TR> </TABLE> 点击上面一个tr，div_1隐藏
      

  5.   

    晕 楼主 你给的html明显两个tr就是平行关系 怎么能算是子tr?
      

  6.   

    我知道是两个平行的关系啊。不知道有没有哪位搞过织梦的cms就是那种类似的 无限分类管理
      

  7.   

    <html >
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>test</title>
    <script> 
    function aa(obj){    for (i=obj;i!=null;i=i.nextSibling){
        
            if (i.nodeType==1){            if (i.id =='sub'){
                    i.style.display='none'
                   
                    
                }
            }
        }
    }
    </script>
    </head><body >
    <TABLE border="1" > 
    <tr onclick = "aa(this)" ><TD>a </TD> <td>d </td></tr>    
    <tr id="sub"> 
        <td>aa </td> <td>dd </td> 
    </tr> 
    <tr> 
        <td>b </td> 
    </tr> </TABLE> </body>
    </html>
      

  8.   

    其实。是这样的。<div>
        <TABLE border>
            <TR onclick = 'showDiv()' >
                <TD>a</TD>
                <td>b</td>
            </TR>
        </TABLE>
        <div id = 'div_1'>
            <table border>
                <TR>
                    <TD>d</TD>
                    <TD>e</TD>
                </TR>
            </table>
            <div id = 'div_2'>
                <table border>
                    <TR>
                        <TD>s</TD>
                        <TD>s</TD>
                    </TR>
                </table>
            </div>
        </div>
        <TABLE border>
            <TR onclick = 'showDiv()' >
                <TD>k</TD>
                <td>k</td>
            </TR>
        </TABLE>
    </div>应该是多个表 
    单表解决不了这种问题
      

  9.   

    不知道是不是这个意思？？？？<html> 
    <head> 
    <title>无标题文档 </title> 
    <meta http-equiv="content-type" content="text/html;charset=gb2312"/>
    <script type="text/javascript"> 
    function showDiv(id){
      var div=document.getElementById('div_'+id);
      if(div.style.display=="none")div.style.display="";
      else div.style.display="none"
    }
    </script> 
    </head> 
    <body> 
    <div> 
        <TABLE border> 
            <TR onclick = 'showDiv(1)' > 
                <TD>a </TD> 
                <td>b </td> 
            </TR> 
        </TABLE> 
        <div id = 'div_1'> 
            <table border> 
                <TR> 
                    <TD>1</TD> 
                    <TD>1</TD> 
                </TR> 
            </table> 
            <div id = 'div_1_2'> 
                <table border> 
                    <TR> 
                        <TD>1_1</TD> 
                        <TD>1_1</TD> 
                    </TR> 
                </table> 
            </div> 
        </div> 
        <TABLE border> 
            <TR onclick = 'showDiv(2)' > 
                <TD>c</TD> 
                <td>d</td> 
            </TR> 
        </TABLE> 
        <div id = 'div_2'> 
            <table border> 
                <TR> 
                    <TD>2</TD> 
                    <TD>2</TD> 
                </TR> 
            </table> 
            <div id = 'div2'> 
                <table border> 
                    <TR> 
                        <TD>2_1</TD> 
                        <TD>2_1</TD> 
                    </TR> 
                </table> 
            </div> 
        </div> 
    </div> 
    </body> 
    </html>
      

  10.   

    <script type="text/javascript">
    <!--
        function setDisplay(o)
        {
            var o = o.getElementsByTagName("dl");
            if (o[1])
            {
                var b = o[0].className=="dlBlock";
                o[0].className = b?"dlNone":"dlBlock";
                o[1].className = b?"none":"block";
            }
        }
    //-->
    </script>
    <style>
    .dlBlock{
        cursor:pointer;
        background-image:url(http://www.ucom.com.cn/u_product/Images/Arrow.gif);
        background-repeat:no-repeat;
        background-position:0px;
        padding-left:20px;
    }
    .dlNone{
        cursor:pointer;
        background-image:url(http://www.ucom.com.cn/u_product/Images/Arrows.gif);
        background-repeat:no-repeat;
        background-position:0px;
        padding-left:20px;
    }
    .block{display:block;}
    .none{display:none;}
    ul{margin:0px;}
    ul li {list-style-type: none;margin-left:20px;}
    </style>
     </head> <body>
      <ul>
            <dl onclick="setDisplay(this.parentNode)" class="dlBlock">这是标题</dl>
            <dl>
                <li>11111</li>
                <li>22222</li>
            </dl>
      </ul>
      <ul>
            <dl onclick="setDisplay(this.parentNode)" class="dlBlock">这是标题2</dl>
            <dl>
                <li>33333</li>
                <li>44444</li>
            </dl>
      </ul>
     </body>
    </html>
      

  11.   

    已经做完了。就是13搂的那个意思。单table做不到。需要用到多table结贴。。