在我的js代码中,我正在克隆表格的最后一行,并尝试将ID递增一。
任何帮助都将不胜感激!JSFIDDLE。此链接涉及IT技术,请根据格式要求进行翻译。
function addNewRow() {
$('#FinancialDataTable tbody').append($('#FinancialDataTable tbody tr:last').clone());
$('#FinancialDataTable tr').each(function(i) {
$(this).find('tr:last');
var selectinput = $(this).find('select');
var textinput = $(this).find('input');
var textarea = $(this).find('textarea');
i++;
selectinput.eq(0).attr('id', 'FinancialItem'+i);
textinput.eq(0).attr('id', 'FinancialAmount'+i);
textarea.eq(0).attr('id', 'FinancialDescription'+i);
});
}
我在表格的行中有以下代码:
<table id="FinancialDataTable">
<tr>
<td>
<div class="form-group">
<select class="form-control" id="FinancialItem"></select>
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" id="FinancialAmount"></select>
</div>
</td>
<td>
<div class="form-group">
<textarea class="form-control" id="FinancialAmount"></select>
</div>
</td>
</tr>
</table>
<button type="button">Add New Row</button>
与其将新添加的行加一,它会将原始行更改为:
<table id="FinancialDataTable">
<tr>
<td>
<div class="form-group">
<select class="form-control" id="FinancialItem2"></select>
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" id="FinancialAmount2"></select>
</div>
</td>
<td>
<div class="form-group">
<textarea class="form-control" id="FinancialAmount2"></select>
</div>
</td>
</tr>
</table>
<button type="button">Add New Row</button>
当我再次点击按钮时,我会得到:
<table id="FinancialDataTable">
<tr>
<td>
<div class="form-group">
<select class="form-control" id="FinancialItem3"></select>
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" id="FinancialAmount3"></select>
</div>
</td>
<td>
<div class="form-group">
<textarea class="form-control" id="FinancialAmount3"></select>
</div>
</td>
</tr>
</table>
<button type="button">Add New Row</button>
任何帮助都将不胜感激!JSFIDDLE。此链接涉及IT技术,请根据格式要求进行翻译。
div.form-group
呢? - Noah Wetjen