如何根据当前列数添加一行表格单元格

Question

说明：当＆＃34;添加行＆＃34;单击，我想要一个新的<tr></tr>附加到tablebody。在行内，我希望<td></td>等于当前列数。

潜在的节省时间：我相信我的jQuery的最后一行是问题，因为我是盲目的。

HTML：

<!-- onClick Button -->
<div id="addRow">Add Row</div>

<table>
  <thead>
    <tr>
      <th colspan="2">Header</th>
      <th colspan="2">Header</th>
      <th>Header</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td></td>
      <!-- etc... -->
    </tr>
    <tr>
      <td></td>
      <!-- etc... -->
    </tr>
    <!-- When button is clicked, add a <tr> with <td> inside. --> 
    <!-- number of <td> = current column span total -->
  </tbody>
</table>

jQuery的：

$('#addRow').click(function(){
  function getMaxColCount($table) {
    var maxCol = 0;

    $table.find('tr').each(function(i,o) {
      var colCount = 0;

      $(o).find('td:not(.maxcols),th:not(.maxcols)').each(function(i,oo) {
        var cc = Number($(oo).attr('colspan'));
        if (cc) {
          colCount += cc;
          } else {
            colCount += 1;
          }
        });
    });

  //assuming this bit is my issue, primarily the last line. 
  //How do I tell jQuery to add multiple <td></td> based on the maxCol value?
    return maxCol;
    var addTD = '<td></td>'
    $('tbody').append('<tr>'addTd * maxCol'</tr>');
});

在this thread中找到jQuery的列计数。

jsFiddle： https://jsfiddle.net/CSS_Apprentice/wfd8uryv/2/

Answer 1

如何克隆最后一行？并删除上一个内容。

    $('#addRow').click(function(){
        var newOne = $("table tr:last").clone();
        $("table tr:last td").text("");
        newOne.insertAfter("table tr:last");
    });

Your fiddle