Question

我正在创建一个简单的网络应用，用户进来;从下拉框中选择并输入一些文本。完成此操作后，用户按下“生成”按钮，将显示生成的连接字符串（显示在<span>中），然后用户可以复制和粘贴。我已经让它连续工作没问题了。

但我现在想要实现的是拥有一个“添加行”按钮，用户可以单击该按钮来复制上面的行。我遇到的问题是确保在复制行并单击生成按钮后，复制的<span>将填充与前一个<span>相同的值。

更新：所以我设法使用JQuery中的clone()函数来复制行并将其添加到下面。是否可以更改复制的每个元素的ID，包括表单的ID。即，当它被复制时，它被复制到的表格将被称为“Form1”

JS小提琴我所拥有的是：

http://jsfiddle.net/XJEAn/

更新2：基本上我需要类似于this的东西，但对于我尝试过的代码！

Answer 1

我已经更新了您的小提琴，以便为新表单提供唯一ID

。

http://jsfiddle.net/zq3AN/

它可能并不完美，但应该让你朝着正确的方向前进。

var uniqueId = 1;
$(function() {
     $('.addRow').click(function() {
         var copy = $("#original").clone(true);
         var formId = 'NewForm' + uniqueId;
         copy.attr('id', formId );


         $('#campaign').append(copy);
         $('#' + formId).find('input,select').each(function(){
            $(this).attr('id', $(this).attr('id') + uniqueId);

         });
         uniqueId++;  
     });
});

基本上你复制表单，更改它的id，然后将它附加到div。然后，您查看所有输入并选择并将相同的uniqueId参数附加到其ID。

Answer 2

我认为您可以使用jQuery clone() function来实现“添加行”功能。

查看最后一个示例，为每个新行提供唯一的ID。

在JQuery中克隆并为每个添加唯一ID

2 个答案: