javascript - 如何从 JavaScript 中的 File-API 对象中删除属性？

Question

我正在使用 JavaScript"file"api 来读取有关将要上传的图像的信息，以便在实际上传发生之前生成预览缩略图，基于此处的演示 (JavaScript file api)。

使用具有“多个”属性的文件输入，可以同时选择一个或多个文件，如下所示:<input type="file" id="imageFiles" name="userfile[]" multiple />

一旦用户选择了图像，我就用 firebug 检查元素，我可以在 DOM 中看到"file"对象包含有关每个所选图像的信息。

"file"对象将包含与所选文件一样多的属性，并且每个属性都有关于每个图像的信息。我只能将"file"对象描述为一个关联数组，因为每个属性本身就是一个对象。

我想要做的是能够从"file"对象中删除给定的属性，从而删除将上传的图像之一，而无需再次选择图像。

到目前为止，这是我尝试过的方法，但它不起作用:

var getAllFiles = document.getElementById('imageFiles');
var allImages = getAllFiles.files; // returns an object with X properties
delete allImages[X]; // "X" is whatever property key I'm passing in

我已经尝试过“splice()”方法，但它也不起作用。

非常感谢。

Answer 1

.files 是只读的，所以你不能修改它。您可以将文件本身提取到一个数组中，但是您不能使用正常的表单上传，您需要通过 binary XHR 上传它们

您可以使用以下方法将文件提取到普通数组:

var files = [].slice.call( this.files );
files.splice( 1, 1 ); //whatever works for normal array

您也可以首先将 accept="image/*" 放在输入中:

<input type="file" id="imageFiles" accept="image/*" name="userfile[]" multiple />

我想你明白这些在 IE 或任何其他没有文件 API 的浏览器中是行不通的。