Question

我正在尝试计算表格的总列数。

例如

   <table>
      <tr>
        <td>55</td>
        <td>22</td>
        <td>66</td>
      </tr>  
      <tr>
        <td>1</td>        
        <td>2</td>
        <td>3</td>        
      </tr>
   </table>

上述结构将为我提供3列。

我也在为我的td做点什么。

我的代码就像

 $("table td").each(function(){
        codes to manipulate td...
 })

我想知道我是否可以在上面的each代码中计算我的表格的最大列。

任何人都可以给我一个提示吗？谢谢！

Answer 1

$("table td").length将返回表格中的所有列，这些列是（6）不是您想要的。

$("table tr:eq(0) td").length，将为您提供第一行中的列数。

Answer 2

以下内容将计算第一行中的列数。它会增加第一行中的列的计数（使用.index确定）：

var cols = 0;
$("table td").each(function(){
    if ($(this).closest("tr").index() == 0) cols++;
})

(Fiddle)

以下计算表中的最大列数（如果行具有可变列数，则非常有用）：

var maxColumns = Math.max.apply(null, $("table tr").map(function() { 
    return $(this).find("td").length; 
}));

(Fiddle)

Answer 3

Math.max.apply(null, $("table tr").map(function(_,row) { return $(row).find("td").length; }))

Answer 4

感谢lbu，但我希望我能在每个内部写一些代码功能

你可以，但它不是那么干净......

DEMO

var maxCols = 0,
    firstTr = $('table tr:first-child')[0];

$("table td").each(function() {
    var $this = $(this);

    if ($this.parent()[0] === firstTr) {
        maxCols += parseInt($this.attr('colspan'), 10) || 1;
    }
});

注意：这也会影响colspans。

Answer 5

我能想到的最简单，最高效，最可重复使用的解决方案是：

function colCount($table) {
  return $table.find('tr').eq(0).children().length;
}

var cols = colCount($('table#myTable'));

如何计算表格中的列数

5 个答案: