等待文件加載（onload JavaScript）

Question

我想從文件中讀取文本並將其返回到函數中。所以這裏是我的代碼的重要部分：

 function getFileRequest(id, contentType, callback) { 
     var val = "x";  

     if (window.File && window.FileReader && window.FileList && window.Blob) { 
      var element = document.getElementById(id); 

      var file = element.files[0]; 
      if(file != null) {  
       if(file.type.match("text/xml")){ 
        var r; 
        r = new FileReader(); 

        r.onload = function (e) { 
         val = e.target.result;      

        }     
        r.readAsText(file); 
       } 
       else 
        alert("Wrong file format"); 
      } 

     } else { 
      alert('The File APIs are not fully supported by your browser.'); 
     } 

     alert(val); 
     if(val == null) 
       return ""; 
      else 
       return getRequestBody(id,contentType,val); 

    } 

我想將文本傳遞給一個名爲「val」的變量。但是，至少在我看來，alert（val）總是顯示默認的「x」，因爲它可能不是等待onload函數被執行。我對嗎？ 那麼我怎樣才能訪問那個文本呢？有沒有辦法等待執行？

Answer 1

當然，警報不在onload函數中，所以立即調用它。

你可以這樣做：

 var val = "x";  
     //... code to load a file variable 
     var r; 
     r = new FileReader(); 

     r.onload = function (e) { 
      val = e.target.result; 
      r.readAsText(file); 
      alert(val); 
     }; 

你不能等待和停止代碼的執行，所以總的想法是使用一個回調推遲它。

假設你展示的代碼確實被分爲兩個部分，一個做做文件操作和使用它的另外一個，它可能是這樣的：

function fetchVal(callback) { 
     var val = "x";  
     //... code to load a file variable 
     var r; 
     r = new FileReader(); 
     r.onload = function (e) { 
      val = e.target.result; 
      r.readAsText(file); 
      callback(val); 
     }; 
} 

fetchVal(function(val){ 
    alert(val); 
    // use val 
});