jQuery clone（）FireFox bug – 无法提交克隆表单

我想添加/删除动态表单。 我正在使用存储在表中的表单，每行都有表单。 我有2个表： – 正在显示的表 – 由我想要克隆并插入显示的表中的临时行包围的表。

在IE中一切正常，但无法提交在Firefox中具有其表单的克隆行。 如果我不克隆行但只是插入它，我可以提交表单，但我需要能够重用该行再插入它，所以我需要使用克隆。 使用和不使用克隆生成的Html代码在Firebug中看起来相同。 我怎样才能克服这个问题？

用于克隆和插入行的代码： $('#tempRow').clone().insertAfter($('#templatesTable tr:last'));

Answer 1

您无法可靠地克隆具有ID属性的内容并将其重新插入DOM。 这会创建一个无效的HTML文档，因为您有两个具有相同ID的元素。 Firefox表现正常。

您需要做的是克隆表单，然后将所有ID更改为唯一的（表单及其所有输入和子元素）。 然后你就可以提交表格了。

看起来你正在克隆一个tr元素并将其插入表中？ 如果tr元素是唯一一个带有ID的元素，这将起作用：

 $('#tempRow') .clone() .attr('id', 'tempRow-new') .insertAfter($('#templatesTable tr:last')); 

但请记住，如果表单元素或其任何子元素（包括div ， frameset ， input等）具有ID，则需要删除该ID或更改它。 否则你仍然会有一个无效的文件，可能仍然有问题。

另外

上面的代码段不可重用。 一旦你尝试第二次克隆表单，你将有两个id为tempRow-new元素。 如果需要多次克隆该行，则必须添加一些递增数或某种UUID以确保所有克隆元素都是唯一的。