Javascript文件读取器

Javascript File Reader

本文关键字：读取 文件 Javascript      更新时间：2024-05-22

我可能只是不了解文件读取器api，但了解

当我尝试运行时：

for (var i = 0, f1, f2; f1 = files[sorted_index[i]], f2 = files[sorted_index[i+1]]; i=i+2) {
    var file_one;
    var file_two;
    if(f1.size < f2.size){
        file_one = f1;
        file_two = f2;
    } else {
        file_one = f2;
        file_two = f1;
    }
    var file_one_contents;
    var file_two_contents;

  var reader = new FileReader();
  reader.readAsText(file_one);
  reader.onload = readSuccess;
  function readSuccess(evt){
    file_one_contents = evt.target.result;
  }
  var reader = new FileReader();
    reader.readAsText(file_two);
    reader.onload = readSuccess2;
  function readSuccess2(evt2){
    file_two_contents = evt2.target.result;
  }
    console.log(file_one_contents);
    console.log(file_two_contents);

控制台日志中只包含未定义的。脚本的目标是读取两个CSV，从这对文件中获取数据并进行一些计算。

谢谢！

API是异步的。"success"函数是在操作完成时调用的，不会立即调用。

将console.log()调用移动到处理程序函数内部的。

编辑—如果你需要等到两个文件都准备好才开始做这些事情，你可以这样做：

  var countdown = 2;
  var reader = new FileReader();
  reader.readAsText(file_one);
  reader.onload = readSuccess;
  function readSuccess(evt){
    file_one_contents = evt.target.result;
    countdown--;
    if (countdown === 0) go();
  }
  var reader = new FileReader();
    reader.readAsText(file_two);
    reader.onload = readSuccess2;
  function readSuccess2(evt2){
    file_two_contents = evt2.target.result;
    countdown--;
    if (countdown === 0) go();
  }

当然，还有更复杂的方法可以做到这一点，但这个简单的技巧只是等到计数器为零后再调用"go（）"，它表示处理文件的函数。

我也遇到过类似的问题，通过使用".onloadend"而不是"onload"来解决文件读取等待问题。在下面的代码中，x绑定到一个"div"元素

reader.onloadend = function (evt) {
    x.innerHTML = evt.target.result;
}

对于"onload"，这一切都是未定义的。

相关文章：