2

我有一个表单，我需要在按钮单击时动态添加某些行。Html 在单击时动态添加，但我需要更改动态添加元素的id值。

演示

JS代码

   $(function () {
    $('.click').on('click', function () {

        $('#mytable tbody tr').clone(true).insertAfter('#mytable tbody');

    });

});

我需要的是为每个文本框<input type="text" id="name_1" />的 id 属性添加一个增量值。有任何想法吗？

4

3 回答 3

2

如果您想在添加时更改每个文本框的 ID，请尝试以下操作：

// Code goes here
$(function(){
  var unique_id=0
  $('.click').on('click',function(){
    unique_id++
    $('#mytable tbody tr').clone(true).insertAfter('#mytable tbody')
      .find("input")
        .each(function(){
          $(this).attr("id",$(this).attr("id")+"_"+(unique_id))
        })

  });

});

分叉你的 Plunker：http ://plnkr.co/edit/R6qvaZ2m2Kt2DEGL3SWF?p=preview

注意：此表单数据将无法正确提交，因为字段没有任何名称值。如果你打算让表单自然提交，而不是依赖 JS，你总是可以尝试以下方法：

<input type="text" name="name[]" />
<input type="text" name="age[]" />
<input type="text" name="salary[]" />

...在这种情况下，您完全可以复制输入字段，而不必给每个字段一个唯一的 ID。

于 2013-10-09T07:54:49.550 回答
0

我认为您需要在插入克隆元素之前更改其 ID？您可以尝试在这个可能类似的问题上发布的答案：How to JQuery clone() and change id

var c = 0;
$("button").on('click',function(){
  var klon = $( '#id'+ c );
  klon.clone().attr('id', 'id'+(++c) ).insertAfter( klon );
});

jsfiddle在这里

于 2013-10-09T07:44:32.780 回答
0

您可以使用以下方法更改 id 属性：

$(selector).attr('id', 'new-id-here');
于 2013-10-09T07:43:26.587 回答