javascript - jQuery - 克隆
带有表单元素，包括它们的值

Question

我有一个 Django formset，它有很多表单元素。我有一种创建新空表单的工作方法，但我还需要一个复制表单的解决方案。从技术上讲，所有表单都在一个 div 中，如下所示：

<form>
...
    <div class="subform">
         ...
    </div>
...
</form>

问题是，在最新的 jQuery 版本中，html 和 replaceWith 方法不处理输入值，因此它们创建了空的表单元素——这不是我需要的行为。当然，我可以实现一个算法来迭代所有元素，复制它们并设置它们的值，但如果可能的话，我想避免它。

我想用复制的值替换现有表单。

score 3 · Accepted Answer

是的，可以使用clone()和replaceAll()代替html()/ replaceWith()。clone()将保留元素的value属性，<input>甚至可以保留事件处理程序和自定义数据。

您可以编写如下内容：

var theForm = $("selector-matching-your-form");
theForm.clone(true).replaceAll(theForm);

score 0 · Accepted Answer

Frédéric 有一个绝妙的答案，我花了一段时间才理解它。这是一个不同的版本：

创建一个引用元素的变量。

var someElement = $("input#some-element");

克隆元素

var cloneOfElement = $someElement.clone(true);

通过使用引用原始元素的变量，使用克隆替换原始元素。

cloneOfElement.replaceAll( $someElement );

--

来自 replaceAll() 文档：“.replaceAll() 方法类似于 .replaceWith()，但源和目标颠倒了。”

javascript - jQuery - 克隆带有表单元素，包括它们的值