Question

<form id="form1" name="form1" method="post" action="">
<table width="100%" border="1" cellspacing="0" cellpadding="0" id="mans">
    <tr>
        <td>
            <input type="text" name="item[]" id="11" />
        </td>
        <td>
            <input type="text" name="recommendations[]" id="12" />
        </td>
        <td>
            <input type="text" name="importance[]" id="13" />
        </td>
        <td>
            <input type="text" name="quantity[]" id="14" />
        </td>
    </tr>
</table>

添加行

http://jsfiddle.net/yKjuw/283/

我一直在经历大部分问题，因为我不知道自己在做什么。使用上面的小提琴，您可以看到name属性修改为FIRST表td的ID。我需要每列的名称保持不变。我试图用td添加其他变量：second td：third但函数根本无法工作。有人可以帮忙吗？

Answer 1

您可以根据当前输入元素的最后一行和索引获取输入的名称，如

master 04-08-2003 09:13

演示：Fiddle

您可以使用function addTableRow(jQtable) { var $row = jQtable.find("tr:last"), $inputs = $row.find('input'); var lastId = $row.find("td:first input").attr("id"); var newId = parseInt(lastId) + 10; var row = $('<tr />'); for (var i = 0; i <= 2; i++) { var thisId = newId + i; var cell = $('<td />'); var label = $('<label for="' + thisId + '">' + thisId + '</label>'); var input = $('<input type="text" name="' + $inputs.eq(i).attr('name') + '" id="' + thisId + '" />'); cell.append(label, input); row.append(cell); } row.append('<td><a href="#">del</a></td>'); jQtable.append(row); }来简化此

.clone()

演示：Fiddle

Answer 2

或者：Fiddle

使用克隆，简单。 jQuery clone

function addTableRow(e) {
    var row = $('#mans tr:last');
        row = row.clone(true);
        row.find('>td>input').each(function(){
            var t = $(this), id = t.attr('id'), new_id = id*1+10;
            t.attr('id',new_id);
        });
    $('#mans').append(row);
}
function removeRow(e){
    e.preventDefault();
    $(this).parents('tr').remove();
}
$(function () {
    $('#addRow').on('click', addTableRow);
    $('table tr>td>a').on('click', removeRow);
});

动态添加行 - 从上方追加行

2 个答案: