web 表格,画table真是难画~!

解决方案 »

  1.   

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>动态插入表格</title>
    <script>
    function a(){
    var sTable="<table width=400 border=1 cellpadding=0 cellspacing=0>";
    for(var i=1;i<=6;i++){
    sTable+="<tr>";
    if(i==1)
    sTable+="<td rowSpan=6> </td>";
    if(i%2==1)
    sTable+="<td rowSpan=2> </td>";
    sTable+="<td> </td><td> </td></tr>";
    }
    sTable+="</table>";
    window.document.write(sTable);
    }
    </script>
    </head>
    <body onload="a()">
    </body>
    </html>
      

  2.   

    要是我就不做一个真正的表格,而是仿造一个,你的1,2,3,4列之间估计有关联关系,做为一个真正的表格,很难单列扩展,尤其动态的.可以做4个单列(表格或div),然后把4个列拼接
      

  3.   

    自己搞定了。贴上来,给大家分享。用的前台javascript合并单元格。
    TheTable为要合并的table id,ColumnIndex 需要合并的列~function MergeTableCell(TheTable,ColumnIndex)
    {
     
       var RowCount = TheTable.rows.length;
       var CurrentRow = null;
       var NextRow = null;
       var MergeTag = 0;
       var StartMergeCell = 0;
       var EndMergeCell = 0;
       var NextCell = null;
       var Iter = 0;
       
      
       for(var i=0;i<RowCount;i=Iter)
       {
          MergeTag = 0;
          StartMergeCell = 0;
          EndMergeCell = 0;
          CurrentRow = TheTable.rows(i);
         // window.alert(CurrentRow.cells(ColumnIndex).innerText);
          if ((CurrentRow.cells(ColumnIndex) != null)&&(i != RowCount-1))
          {                   
             for(var j=i+1;j<RowCount;j++)
             {
                NextRow = TheTable.rows(j);
                NextCell = NextRow.cells(ColumnIndex);
                var strNext = new String();
                strNext = NextCell.innerText;
                var strCurr =new String();
                strCurr = CurrentRow.cells(ColumnIndex).innerText;
                if ( strNext !=  strCurr)
                {
                  break;
                }
                else
                {
                   if (j==i+1)
                   {
                     StartMergeCell = j;
                   }
                   EndMergeCell = j;
                   MergeTag++;
                }
                  
             }
            
             if (MergeTag != 0)
             {
                CurrentRow.cells(ColumnIndex).rowSpan = MergeTag + 1;
                for(var k=StartMergeCell;k<=EndMergeCell;k++)
                {
                   TheTable.rows(k).deleteCell(ColumnIndex);
                }
             }
          }
           Iter = Iter + MergeTag + 1 ;
        }
           
    }