Jquery插入表行并增加输入ID答案

【问题标题】：Jquery insert table row and increment input idJquery插入表行并增加输入ID
【发布时间】：2014-08-22 23:54:26
【问题描述】：

我有一个动态 html 表格/表单，它有两个按钮可以向表格中添加一行。一个按钮将一行添加到表的末尾并适当地增加输入 id。另一个按钮旨在在当前行之前插入一行......它可以这样做，直到我尝试让它增加 id。我当前的 jquery 代码适当地更新了 id，但去掉了导致所有输入字段被粉碎到表的单个单元格中的标签。我在下面包含了我现有的代码 sn-ps。 . .我错过了什么？

link to fiddle

jquery 代码：

$(document).on('click', 'button.insertbutton', function () {
    var rowCount = $('#orderDetail tr').length;
    alert(rowCount);
    $(this).closest('tr').before($(this).closest('tr').find('input')
        .each(function() {
        $(this).attr({
          'id':  function(_, id) { 
            var regex = /[a-zA-Z]+/
            return id.match(regex) + rowCount },
          //'name':  function(_, name) { return name + rowCount },
           'value': '',
        });
      })
    ).clone(true);
    return true;
});

我怀疑问题出在我遍历输入项然后克隆回该行的部分中。

任何指导将不胜感激。

根据推荐编辑包含 FIDDLE...谢谢您的推荐。

【问题讨论】：

我建议创建一个小提琴，链接到它，并将您的代码 sn-ps 集中在您认为可能存在问题的部分。
这个问题应该是附上一些HTML吧？
我包含了 html，尽管试图保持简洁，但它有点冗长且令人困惑。根据 klenwell 的建议，包括一个小提琴，我编辑了这个问题，包括一个指向 jsfiddle.net/6y18mho8/2 的链接，该链接将包含 html。谢谢！

标签： javascript php jquery html forms

【解决方案1】：

我能够通过将操作分成两个步骤而不是尝试在一行中完成任务来解决克隆和增量 ID。插入和更新id的jquery代码如下：

$(document).on('click', 'button.insertbutton', function () {
var rowCount = $('#orderDetail tr').length;
$(this).closest('tr').before($(this).closest('tr').clone());
$(this).closest('tr').find('input').each(function() {
    $(this).attr({
        'id': function(_,id) {
            var regex = /[a-zA-Z]+/
            return id.match(regex) + rowCount },
        'value': '',
    })
})

return true;

});

我希望这对将来的某人有所帮助

【讨论】：