如何从一个输入得到多个文件输入(how to get multiple file input fro

使用浏览器Firefox和Chrome

我有一个输入文件中的元素。

<input type='file' id='tempFileInput' multiple></input>

让我们说，我已经选择了上述文件输入框（“tempFileInput”）三个文件;

的OnChange我想三个文件分成每个文件三个新的文件输入框。 即

<input type='file' id='inputFile_0'></input> 
<input type='file' id='inputFile_1'></input> 
<input type='file' id='inputFile_2'></input>

我竭力要实现这一目标。 任何帮助吗？

//我写了一个小型的JavaScript朝我WANA实现片段。

var index = 0;
function multipleInputBoxes(tempFileInput){
   var divForm = document.getElementById('divForm');
   var numOfFiles = tempFileInput.files.length;

   for(var i=0; i<numOfFiles; i++){
      var newUploader = document.createElement('input');
      newUploader.type='file';
      newUploader.id = 'inputFile_' + index;

      var file = tempFileInput.files[i];
      ***newUploader.files[0] = file;***
      //above line does not work, as by default due to security reasons input type='file' is read only, and non editable.

      divForm.appendChild(newUploader);
      index++;
   }
}

Answer 1:

如果您对HTML5，你可以选择一个多个文件input标签。 有没有需要额外的。

使用HTML5如下：

<input type='file' id='tempFileInput' multiple='multiple'></input>

更新：

有没有办法做你想要什么。 该files属性俱备只为一个原因。 这是为了防止上传文件，而无需用户的同意。 如果它不是只读的，那么你可以编写脚本，并从用户的计算机，这是一个巨大的安全问题上传任何文件。

Answer 2:

所以，我有困难访问文件（S）形式单一的FileInput并分别为他们节省每形式。 正如我可以访问的每个文件var file = tempFileInput.files[i]我创建一个循环，并在一个HTML“对象”标签保存每个文件和在object.value保存的文件对象。 对于如

var numOfFile = tempFileInput.files.length;
for (var int i=0; i<numOfFile; i++){
    //get file object from the filinput element
    var file = tempFileInput.files[i];

    //create new element
    var newObj = document.createElement('object');
        newObj.id = 'obj_' + i;
        newObj.value = file;

    //append object to new form
    createNewForm(newObj);
}

function createNewForm(newObj){
   ...do something here
   ...
   ...
   newForm.appendChild(newObj);
}

文章来源: how to get multiple file input from a single input