Jquery 从.clone（）输入的空文件

我正在尝试克隆一个文件输入表单，每当我选择一个文件，然后单击“添加更多”以克隆文件输入时，该表单都会复制输入中选定的文件

<input type="file" />
<span id="add-more-files">Add more</span>

演示：

现在，无论何时在克隆前一个文件之前选择一个文件，都可以看到它已选中相同的文件，我需要它在克隆时为空

编辑：

我如何才能克隆这个，指的是

您可以尝试的是：

$('#add-more-files').click(function()
{
   var cloned = $(this).prev().clone();
   cloned.val(null);
   $(cloned).insertBefore($(this));
});

更新 或者，如果所有输入都是前一个输入的副本，只需创建一个新输入，而不是克隆：

$('#add-more-files').click(function()
{
   var cloned = $(this).prev();
   $('<input>',{type:cloned.attr('type')}).insertBefore($(this));
});

---

我找到的唯一可行的解决方案是提供文件输入字段作为隐藏的模板。然后在加载页面后创建一个克隆以提供第一个字段

它也可以在没有“添加更多”按钮的情况下工作，而是在填写最后一个文件输入字段时添加一个新的文件输入字段

函数AddUploadElement { var newUploadElement=$files.children:first-child.clone； newUploadElement.cssdisplay； $files.appendnewUploadElement； } $document.readyfunction { 添加上传元素； $files.onchange、输入、函数 { 如果$this.is:last child==true { 添加上传元素； } }; }; 克隆部分很重要，因为模板输入字段可能有其他属性。

该插件避免了如下清除文件输入的问题：

var inputClone = input.clone(true);
$('<form></form>').append(inputClone)[0].reset();
input.after(inputClone).detach();

i、 e.克隆输入，附加到临时表单以重置它，并分离输入，以便可以连续附加到表单

---

然后，您可以输入.replaceWithinputClone

你在用什么浏览器？在chrome中，它变为空。这将不起作用，出于安全原因，您不能编辑of类型文件的值。他的原始代码在of类型文件上没有使用.val。@Drackir my new part与val无关您应该删除第一个部分，因为它不起作用。第二种方法应该满足提问者的要求。此外，您不需要克隆对象或在insertBefore中将其包装。好主意很好的一段代码。您是否尝试过创建父换行div并克隆它？

$('#add-more-files').click(function()
{
   var cloned = $(this).prev();
   $('<input>',{type:cloned.attr('type')}).insertBefore($(this));
});

var inputClone = input.clone(true);
$('<form></form>').append(inputClone)[0].reset();
input.after(inputClone).detach();