HTML5 文件上传脚本未加载文件

Question

HTML5 文件上传功能的新手，发现我无法上传简单的 xml 文件并能够将文件内容导入控制台。预期的行为是我 select 一个 xml 文件，然后看到在控制台中呈现的内容。但是，我从未进入 console.log 步骤 - 似乎 reader 从未加载过？非常感谢任何解决建议。

<input type="file"></input>
   <script>
 var upload = document.getElementsByTagName('input')[0]; 
    upload.onchange = function (e) {
      e.preventDefault();
      var file = upload.files[0], reader = new FileReader();
      reader.onload = function (event) {
      console.log('evt',reader.readAsText(file));
      };


  return false;
};
</script>

Answer 1

因此您将 reader.onload 事件设置为一个函数，但您需要在此之外调用 reader.readAsText() 函数。

例如，将您的代码更改为：

reader.onload = function(event) {
  console.log(event);
};
reader.readAsText(file);

它的作用是告诉 reader 当你调用 reader.readAsText(file) 时它应该运行你用 reader.onload 定义的函数。

你之前所做的永远不会加载文件，因为你只是在你的函数回调中告诉 reader 到 readAsText，当它已经加载时你告诉它运行已加载！

HTML5 文件上传脚本未加载文件

HTML5 file upload script not loading file

javascript

html

filereader