Javascript 如何在javascript中读取对象文件列表数组？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14824240/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can i read an object filelist array in javascript?
提问by Leo
I have created an array to store a list of selected files. Well, I have to be honest, I looked up the code and when I realized it worked for my purpose, I used it. Now I need to access this array in order to delete some files manually, but I have tried using the index of each sector, but this does not work.
我创建了一个数组来存储所选文件的列表。好吧，老实说，我查了一下代码，当我意识到它对我的目的有用时，我就使用了它。现在我需要访问这个数组以手动删除一些文件，但我尝试使用每个扇区的索引，但这不起作用。
This is how i create the array and store files.
这就是我创建数组和存储文件的方式。
var files = [];
$("button:first").on("click", function(e) {
$("<input>").prop({
"type": "file",
"multiple": true
}).on("change", function(e) {
files.push(this.files);
}).trigger("click");
});
How could I read the array files[] if it contains an object fileList or obtain indexs from the array?
如果数组 files[] 包含对象 fileList 或从数组中获取索引，我如何读取它？
回答by Jacob Dalton
Here's how I understand your code:
这是我如何理解您的代码：
Each time the first button in the dom is clicked a file input dialogue which accepts multiple files is generated. Upon return the dialogue emits a changeevent with a filesvariable (a FileList object) attached to the function context (this). Your code pushes the newly created FileList onto the filesarray. Since the input accepts multiple files each object pushed onto the filesarray is a FileList object.
每次单击 dom 中的第一个按钮时，都会生成一个接受多个文件的文件输入对话框。返回时，对话会发出一个change事件，该事件带有files附加到函数上下文 ( this)的变量（一个 FileList 对象）。您的代码将新创建的 FileList 推送到files数组上。由于输入接受多个文件，因此推入files数组的每个对象都是一个 FileList 对象。
So if you want to iterate through all elements in the files array you can put a function in the changeevent handler:
因此，如果您想遍历 files 数组中的所有元素，您可以在change事件处理程序中放置一个函数：
var files = [];
$("button:first").on("click", function(e) {
$("<input>").prop({
"type": "file",
"multiple": true
}).on("change", function(e) {
files.push(this.files);
iterateFiles(files);
}).trigger("click");
});
function iterateFiles(filesArray)
{
for(var i=0; i<filesArray.length; i++){
for(var j=0; j<filesArray[i].length; j++){
console.log(filesArray[i][j].name);
// alternatively: console.log(filesArray[i].item(j).name);
}
}
}
In the iterateFiles()function I wrote filesArray[i][j]isn't really a multidimensional array -- but rather a single dimensional array containing FileList objects which behave very much like arrays...except that you can't delete/splice items out of them -- they are read-only.
在iterateFiles()我写的函数中，filesArray[i][j]它并不是一个真正的多维数组——而是一个包含 FileList 对象的单维数组，这些对象的行为非常像数组……除了你不能从中删除/拼接项目——它们被读取-只要。
For more info on why you can't delete see: How do I remove a file from the FileList
有关无法删除的原因的更多信息，请参阅：如何从 FileList 中删除文件
回答by charlietfl
Since you are using jQuery you can use $.grep
由于您使用的是 jQuery，因此您可以使用 $.grep
files=$.grep( files, function(elementOfArray, indexInArray){
/* evaluate by index*/
return indexInArray != someValue;
/* OR evaluate by element*/
return elementOfArray != someOtherValue;
});
API Reference: http://api.jquery.com/jQuery.grep/
API 参考：http: //api.jquery.com/jQuery.grep/
回答by Aeolun
Something like this?
像这样的东西？
for(var i = 0; i < files.length; i++) {
alert(files[i][0].name);
if (files[i][0].name == 'file.jpg') {
files.splice(i, 1) //remove the item
}
}
That is, there is always one file in each FileList due to the way you select it. So for each filelist you are only interested in the first file in it. For each file you can just get the properties as defined here: http://help.dottoro.com/ljbnqsqf.php
也就是说，由于您选择它的方式，每个 FileList 中总是有一个文件。因此，对于每个文件列表，您只对其中的第一个文件感兴趣。对于每个文件，您可以获取此处定义的属性：http: //help.dottoro.com/ljbnqsqf.php
