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列。现在，如果我想再添加一列到第二行中第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表（添加列等）非常有问题，但是有一些用于表/数据表示的库可能对您有帮助。

数据表

http://www.datatables.net/
Flexigrid

http://www.flexigrid.info/
SlickGrid

https://github.com/mleibman/SlickGrid
jqGrid

http://www.trirand.com/blog/
dgrid和DojoX数据网格

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

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

3 个答案: