为什么追加仅适用于我代码迭代的最后一次?

时间:2014-09-29 13:37:32

标签: jquery html

我正在从另一张桌子重新创建一张桌子。我知道我做的并不好,但不是我的决定。

我正在遍历每个表并获取创建新表所需的信息。这是为新表创建标题的函数。

function setTableHeader(table, oldTableName, newTableName) {
    table.html($('<thead />'));

    var firstRow = $('<tr><th></th></tr>');
    var row = $('<tr></tr>');
    $('#'+oldTableName+' .budget-inner-table').each(function() {
        var insideText = $(this).find('h3').eq(0).text();
        //console.log(insideText);
        var column = $('<th></th>').text(insideText);
        row.append(column);
    })

    $('table#'+newTableName+' thead').append(firstRow).append(row);

}

这是我新桌子的结果。我不明白为什么最后一张桌子上的标题是空的。

<section id="budget-overview-result">
  <table id="july-2014">
    <thead>
      <tr><th></th></tr>
      <tr>
        <th>July 2014 - Media</th>
        <th>July 2014 - Facebook</th>
        <th>Budgetplanning Online Marketing</th>
      </tr>
    </thead>
  </table>

  <table id="august-2014">
    <thead></thead>
  </table>

2 个答案:

答案 0 :(得分:1)

追加应该在每个循环中发生:)

function setTableHeader(table, oldTableName, newTableName) {
table.html($('<thead />'));

var firstRow = $('<tr><th></th></tr>');
var row = $('<tr></tr>');
$('#'+oldTableName+' .budget-inner-table').each(function() {
    var insideText = $(this).find('h3').eq(0).text();
    //console.log(insideText);
    var column = $('<th></th>').text(insideText);
    row.append(column);
    $('table#'+newTableName+' thead').append(firstRow).append(row);

});


}

答案 1 :(得分:0)

好的,我发现我做错了什么。它不是循环中的附加物。当我为表创建thead时,我需要在循环中调用表。像这样:

所以不是

table.html($('<thead />'));

$('table#'+newTableName).html($('<thead />'));