[英]How can I clone a table row using jQuery?
我想克隆我的tr類行。 因此,當用戶單擊按鈕時,該行將被克隆並設置在最后一行的下方。
我目前使用以下代碼,只有它不能正常工作。 我可能不正確。
JS:
var row = jQuery('.ui-sortable').closest('.ui-sortable').find('tbody tr.row.ui-sortable:last-child');
var clone = row.clone();
克隆的字段如下所示:
HTML標記:
echo '<tbody class="ui-sortable">';
echo '<tr class="row">';
echo '<td class="order">1</td>';
// Do some stuff inside the row.
echo '<td class="remove"><a class="repeatable-remove button" href="#">-</a></td>';
echo '</tr>'; // End .row
echo '</tbody>';
我認為javascript的第一段代碼不正確。
如果按鈕在您要克隆的行內 ,則應執行以下操作。 (它可能不完全正確,但可能已經接近)。
$('#your-table').on('click', '.copy-row-button', function() {
var
$table = $(this).closest('table'),
$row = $(this).closest('tr'),
$newRow = $row.clone();
$table.append($('<tbody/').append($newRow));
});
我將行附加在新的<tbody>
元素中,因為Internet Explorer在將<tr>
附加到現有表主體時可能會遇到問題。
該代碼還使用了表格和按鈕的組合選擇器。 您可以使用所需的id / class值制作頁面。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.