如何使用输入文件两次

Question

我有<input type="file" name="attach" multiple>，我需要多次使用2次或更多次。我的意思，我需要的是什么：

1. 首先点击我选择2个文件：

  

file1.png

     

file2.png

1. 第二次点击我选择3个文件：

  

file3.png

     

file4.png

     

file5.png

我需要5个文件。

但是，当我第二次点击时，我刚刚过去3次。

Answer 1

我可以建议，当用户选择文件时，您可以使用具有相同名称属性的新替换以前的<input type="file"....>。

现在用户将再次选择几个文件并提交。您将在服务器端获得两个文件，因为两个输入元素的name属性相同。

<div id="parent">
     <input type="file" name="attach[]" onchange="append_new_input_element(this)" multiple>
</div>

添加以下功能

function append_new_input_element(this){
parent_div = document.getElementById("parent");
this.style.display = "none";
var input = document.createElement("input");
input.type = "file";
input.name = "attach[]";             

input.setAttribute("onchange","append_new_input_element(this)");              
parent_div.appendChild(input);

}

或者我会建议使用dropzone来达到这个目的。 dropzone