表格的行和列的动态展开问题

在报表项目中,要求对行和列都做展开和收拢.
展开后的效果是这样的:
行的展开有很多处理的办法,但没有列展开的处理办法.
展开是无限级别. 展开后还能收拢.向各位请教.如果有谁能解决,可以有偿付费.  

解决方案 »

  1.   

    隐藏列？
    function hideCol(colIndex){
      $("#tab tr").each(function(){
        $($(this).get(colIndex)).hide();
      });
    }
      

  2.   

    table+div实现
    给你写一个
    <table>
        <tr>
            <td>
               <A href="javascript:move() ">+</A>按一下
           </td>
        </TR>
        <tr>
            <td>
               <div id="advImages">
                   <table>
                         <tr>
                             <td>dfdfds</td>
                        </tr>
                  </table>
               </div>       
             </td>
        </TR>
    </table><script >
       function move() {
          if (document.getElementById("advImages").style.display == "none"){
              document.getElementById("advImages").style.display = "block";
          } else {
             document.getElementById("advImages").style.display = "none"; 
          }
       }
    </script>不过你的显示和隐藏的div多，所以move用传参数这样比较方便
      

  3.   

     这个是布局的问题，你把所有的动态生成的（同一级的标签）设置成同一个class利用
    class的.class{
        margin-left:5px;
    }这样每一级都会有比较好看的视图
      

  4.   

     TO  lieri111：鼠标点击后展开，如何处理呢？
      

  5.   

    <HTML>
    <HEAD>
    <META http-equiv="Content-Type" content="text/html; charset=gb2312">
    <TITLE>收缩左边栏效果</TITLE>
    <STYLE type="text/css">
    td{font-size:12px;line-height:22px;}
    .red{color: #FF0000}
    </STYLE>
    <SCRIPT language="JavaScript">
    function show(){
    if(document.getElementById("left").style.display=='none'){ //判断目前左边栏的状态（显示、隐藏）
    document.getElementById("left").style.display='block'; //显示左边栏
    }
    else{document.getElementById("left").style.display='none'; //隐藏左边栏
    }
    }
    </SCRIPT>
    </HEAD>
    <BODY>
    <TABLE width="98%" border="0" cellspacing="0" cellpadding="0" align="center">
    <TR>
    <TD id="left" width="200">点点右边的收缩按钮，看看我是不是进去了！</TD>
    <TD width="8" style="border-right:1 #cccccc solid;"><A href="javascript:show();"><IMG src="image/fclose.jpg" align="absmiddle" border="0"></A></TD>
    <TD valign="top">右侧</TD>
    </TR>
    </TABLE></BODY>
    </HTML> 
    我在给你一个列的收缩