向表中添加新列时，使用默认单元格填充当前行

Question

我创建了一个HTML表并在按钮事件上添加了行和列。 这是我的代码：

function AddColumnToDataTable(){ 
     $('#tableHeader').append("<th> Header </th>").attr("contenteditable", true); 
// Add a new ColumnHeader and set the property "editable" 
    } 
    function AddRowToDataTable(){ 
     var count = $('#tableHeader').find("th").length; 
// Get the count of Columns in the table 

     var newRow = $('#tableBody').append("<tr></tr>"); 
// Add a new Row 

     for(var i = 0; i < count ; i++){ 
      newRow.find('tr').last().append("<td> Content </td>").attr("contenteditable", true); 
// Fill the cells with a default text and set the property "editable" 
     } 
    } 

所以我想在添加新列在旧行设置新的细胞。使行自动填充默认文本。

我是否要计算指数？ 我有x列，在行y z单元格设置，填补缺少的..？

Answer 1

如果我正确地理解了这个问题，您需要在当前行中添加新列也是正确的？

那么这样的事情应该做的伎俩（如果我没有理解正确请发表评论，所以我可以删除或更新我的答案）：

function AddColumnToDataTable() { 
 
     $('#tableHeader').append("<th>Header</th>").attr("contenteditable", true); // Add a new ColumnHeader and set the property "editable" 
 

 
     $('#tableBody').find("tr").each(function() { 
 
      $(this).append('<td>Content</td>'); 
 
     }); 
 
} 
 

 
function AddRowToDataTable(){ 
 
     var count = $('#tableHeader').find("th").length; 
 
// Get the count of Columns in the table 
 

 
     var newRow = $('#tableBody').append("<tr></tr>"); 
 

 
     for(var i = 0; i < count ; i++){ 
 
      newRow.find('tr').last().append("<td>Content</td>").attr("contenteditable", true); 
 
// Fill the cells with a default text and set the property "editable" 
 
     } 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr id="tableHeader"><th>Header</th></tr> 
 
    <tbody id="tableBody"> 
 
    </tbody> 
 
</table> 
 

 
<input onclick="AddColumnToDataTable();" type="button" value="Column" /> 
 
<input onclick="AddRowToDataTable();" type="button" value="Row" />