jQuery，动态表单生成-清空克隆的输入字段？

我正在创建一个表单，其中的一些输入字段类似于：

<label>First Name<input type="text" id="firstname1" name="firstname1"></label>
<label>Last Name<input type="text" id="lastname1" name="lastname1"></label>

然后我需要每个新容器在每次创建新容器时将其类增加1：

var container = $(".emptyContainer div").length;
var containerNumber = container + 1;
var containerClass = 'container' + containerNumber;
$(".emptyContainer .container").attr("class", containerClass);

---

这一切似乎都按我所希望的那样工作——我现在面临的问题是，如果在第一个输入字段中有任何值，复制按钮将创建一个新的容器，其中包含原始字段中的信息。如何克服此问题？

克隆容器后，需要清空输入字段，然后附加到目标容器

$('#replicate').click(function(){
    var clonedElm = $('.container').clone();
    clonedElm.find('input').val('');
    cloneElm.appendTo($('.emptyContainer'));
});

编辑：

您说过，您需要每个新容器在每次创建新容器时将其类增加1。因此，在这种情况下，您需要删除旧类并为克隆的容器分配一个新类

$('#replicate').click(function(){
    var clonedElm = $('.container').clone();
    clonedElm.find('input').val('');
    cloneElm.appendTo($('.emptyContainer'));
});

这就是解决方案：

$('#replicate').click(function(){
    var clonedElm = $('.container').clone();
    clonedElm.find('input').val('');
    var container = $(".emptyContainer div").length;
    var containerNumber = container + 1;
    var containerClass = 'container' + containerNumber;
    clonedElm.removeClass('container').addClass(containerClass);
    clonedElm.appendTo($('.emptyContainer'));
});

---

检查。

这与我的答案有何不同？你应该勾选对你有帮助的答案。看看