JavaScript FileReader：将多个文本文件的内容保存到数组中以供将来使用

问题描述：

我尝试使用纯粹的JavaScript将多个文本文件的内容保存为数组变量。我在*上发现了一些类似的问题和答案，并尝试了这一点，但没有成功。也许这个问题很容易回答，但我是初学者，请耐心等待。JavaScript FileReader：将多个文本文件的内容保存到数组中以供将来使用

这里是我的代码：

<script> 
 
    fileContents=new Array(); 
 

 
    function getThem(){ 
 
     var allFiles=document.getElementById("fileInput").files; 
 

 
     for(var allFilesCounter=0;allFilesCounter<allFiles.length;allFilesCounter++){ 
 

 
     function readFile(file){ 
 
      var reader=new FileReader(); 
 

 
      reader.onload=function(){ 
 
       alert(reader.result); 
 
       fileContents[fileContents.length]=reader.result; 
 
      }; 
 
      reader.readAsText(file,"UTF-8"); 
 
     }; 
 
     }; 
 
    }; 
 
</script> 
 

 
<input type="file" accept="text/plain" id="fileInput" multiple="multiple" onChange="getThem();">

我已经发现上述的FileReader作品“异步”，这似乎需要将文件内容的全部过程都读卡器内部完成.onload功能。 “警告”不起作用，以及其他处理，但不分配内容到全局变量，这就是我的案例中的“fileContents [fileContents.length]”。

这是相当简单的代码是否可以实现，或者我应该接受无法将文件内容保存到变量中（这似乎是最简单最优雅的方式，但可能我是错误）。

非常感谢您的帮助。

答

你在正确的道路上，但你创建了功能readFile，并没有打电话给它，这就是为什么你没有得到文件内容，但该功能是不必要的。贝娄有一个简单的代码工作片段，希望你能理解它。

var fileContents = []; 
 

 
document.getElementById('fileInput').addEventListener('change', handleFileSelect); 
 

 
function handleFileSelect (e) { 
 
    var allFiles = e.target.files; 
 
    for (var i = 0; i < allFiles.length; i++) { 
 
     var reader = new FileReader(); 
 
     reader.onload = function(e) { 
 
      alert(e.target.result); 
 
      fileContents.push(e.target.result); 
 
     }; 
 
     reader.readAsText(allFiles[i]); 
 
    }; 
 
};

<input type="file" accept="text/plain" id="fileInput" multiple="multiple" />

JavaScript FileReader：将多个文本文件的内容保存到数组中以供将来使用

相关推荐