输入文件到数组javascript / jquery

Question

我有一个输入类型的文件，我在其中将要放入javascript的变量中进行操作。

HTML：

<input class="file" id="file1" name="uploadedimages[]" type='file' multiple/>

JavaScript：

var upload = document.getElementById('file1');
upload.files.splice(idtoremove,1) //not working

我如何删除上载变量中的特定项目？我搜索到输入类型文件是只读的，除非将其放入数组并使用ajax上载文件，否则您将无法对其进行操作。

即时通讯这样做上传到我的画廊。首先，我选择多个图像。然后在上传之前先预览图片。还可以选择删除照片。我的问题是。如何删除输入文件中的照片文件。因此，可能的解决方案是将输入文件存储到阵列中，然后删除阵列中所需的照片，然后为阵列创建formdata并使用ajax上传

Answer 1

编辑，更新

如何删除上传变量中的特定项目？

如果预期结果是文件对象数组，则将调整从原始files对象拼接数组项的方法-并发送已拼接的数组作为上载-而不是尝试从原始files对象“删除”项并仍然上传原始files对象。

FileList对象没有.splice()method。尝试利用.slice()，.call()以转换files到Array，则调用.splice()方法的上阵列File对象，例如;

// `_files` : `File` object items from original `files` `FileList`
// call `.splice()` on items that would be uploaded ,
// upload `_files` array - _not_ original `files` `FileList` object
// e.g.; `_files`:`File` objects to _keep_ not "delete" from `files`
var idstokeep = [0, 2]; // splice , keep first `2` files 
var _files = Array.prototype.slice.call(files).splice(idstokeep[0], idstokeep[1]);

或者，利用

项目（）

返回表示文件列表中指定索引处的文件的File对象。

返回特定index范围内的文件FileList

  var files = e.target.files;
  // return `file` at `index` `1`
  var firstFile = files.item(1);

var upload = document.getElementById("file1");



upload.onchange = function(e) {

  var files = e.target.files;

  // https://developer.mozilla.org/en-US/docs/Web/API/FileList#item

  var firstFile = files.item(1);

  var idstokeep = [0, 2]; // keep first `2` files from `multiple` selection

  var _files = Array.prototype.slice.call(files).splice(idstokeep[0], idstokeep[1]);

  console.log(files, files.length

              , _files, _files.length

              , firstFile);

};


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">

</script>

<input class="file" id="file1" name="uploadedimages[]" type='file' multiple/>