HTML5 FileReader 的问题

Question

我尝试在我的项目中运行 FileReader 函数，但它只在过去有效。我的项目工作方式是列出目录中的所有文件。一切正常。但当我从列表中选择一个文件时（我的文件是本地的），我遇到了这个错误，我不理解：

Uncaught TypeError: Failed to execute 'readAsText' on 'FileReader': The argument is not a Blob.

以下是我的代码：

GetFileName function (fs) {
     var target = event.target || event.srcElement;

     var childs = target.parentNode.childNodes;
     {for (i = 0; i ++; i <childs.length)
         if (target == childs [i]) break;
     }

     console.log (i); // Index li
     console.log (event.target.innerHTML); // li value

     filename = "~ / Downloads / snippets" + event.target.innerHTML;

var fr = new FileReader ();
fr.onload = function (e) {
     console.log (e.target.result);
};
fr.readAsText (filename);
}

有人知道什么不起作用吗？

提前感谢您的帮助！

- user1987480

---

错误似乎很明显。您不能将“文件名”提供给它。它需要一个文件的“Blob”表示或“File”对象。 - Xan

我想知道你是如何列出文件的。 - Xan

Answer 1

我认为问题在于你的filename变量被设置为：

filename = "~ / Downloads / snippets" + event.target.innerHTML;

这是一个字符串，而不是FileReader函数所期望的对象类型，如果需要使用readAsText函数，请尝试以下方法：

var fileInputElement = document.getElementById("fileInputElement");
fr.readAsText(fileInputElement.files[0]);

“fileInputElement”是HTML的ID为“<input>”类型为“file”的元素。

这可能不完全符合你的需求，但如果没有看到更多的JavaScript和HTML，很难说。

- ATG