提交表单时，有时会遇到重复添加同一窗体的多个元素。例如，我们需要在订单信息中添加几种不同类型的产品，并在表单数据中添加字段。这次我们可以在表单中直接添加一个附加项或复制按钮，并通过单击按钮来实现复制表单元素。

查看演示下载源码

HTML

在本文中，我们将介绍一个简单的基于jQuery的元素复制插件的示例，该插件可以通过调用插件轻松实现元素复制。

jQuery库文件和元素的副本duplicateelement.min.js首先载入插件。






我们假设需要复制用户信息元素，表单html结构如下所示：




客户名称：

客户层面：

请选择
贵宾
普通的

去除
复制








jQuery

当我们点击复制按钮，我们复制的内容在#附加，这相当于增加了一个新的线。开始时，它只显示复制按钮。复制后，原始的显示删除按钮，然后单击删除以删除相应的行。


$（函数（）{（））
$（#额外）。DuplicateElement（{
class_remove 删除。
class_create 创建。
OnCreate：功能（EL）{
El.find (select).Prop ('defaultSelected');
El.find（输入）瓦迩（）；
}
}）；
}）；


我们还可以使用onCreate（）回调函数来定义新的表单元素的属性，如表单元素的值或风格的复制成功后。

以上内容是共享jQuery复制表单元素附带源代码共享效果演示，希望能对您有所帮助。