如何在html中匹配不同的表格列？

Question

我有如下表結構：

<table> 
    <tr id="tr1"> 
     <td></td> 
     <td></td> 
    </tr> 
    <tr id="tr2"> 
    <td></td> 
    <td></td> 
    <td></td> 
    <td></td> 
    </tr> 
    <tr id="tr3"> 
    <td></td> 
    <td></td> 
    </tr> 
</table> 

，現擁有各2列在第一和最後一排。第二排有4列。現在，如果我想添加一列到對應於第二行第四列的​​最後一行，我知道我應該追加一個空td到最後一行，然後添加該列。但是這種空白的td加入在所有情況下都是不可能的。那麼如何隨機添加列和管理表結構？我可以得到任何幫助嗎？

Answer 1

這是你想要的嗎？

$(document).ready(function(){ 
    addCol("tr3", 4); 
}); 

function addCol(rowid, coldes){ 
    var tr = $("#" + rowid + " td"); 
    var trctr = tr.length; 
    troffset = coldes - trctr; 
    alert(troffset); 
    for(var i = 1; i <= troffset; i++){ 
     tr.parent().append("<td></td>"); 
    } 
} 

http://jsfiddle.net/djb78/1/

Answer 2

你不能那樣做。您必須合併一些單元格並刪除它們的邊框。 rowspan和colspan屬性將幫助

Answer 3

手工處理HTML表格（添加列等）是比較困難的，但也有一些庫表/數據表示，可以幫助您。

1. 數據表

   http://www.datatables.net/

2. Flexigrid

   http://www.flexigrid.info/

3. SlickGrid

   https://github.com/mleibman/SlickGrid

4. 的jqGrid

   http://www.trirand.com/blog/

5. dgrid和DojoX中數據網格

   http://dojotoolkit.org/features/desktop.php