HTML5讀取文件返回讀取文件前的結果

Question

我正在嘗試讀取文本文件並返回結果。

到目前爲止，我能夠讀取文件，但是當我嘗試返回結果時，結果會在文件讀取完成之前返回。

如何強制功能等待結果？ 我想它與回調有關，但不知道如何實現它。

MyFile.prototype.readFile = function(fileDir, fileName) { 
    var strText = ""; 

    window.resolveLocalFileSystemURL(fileDir, gotDir, fail); 
    function gotDir(dir) { 
     dir.getFile(fileName, {create: true}, gotFile, fail); 
    } 

    function gotFile(fileEntry) { 
     fileEntry.file(gotRead, fail); 
    } 

    function gotRead(file) { 
     var reader = new FileReader(); 
     reader.onerror = function(evt) { 
      console.log("Reading " + file.name + " Failed"); 
     }; 
     reader.onloadstart = function(evt) { 
      console.log("Read " + file.name + " Starting"); 
     }; 
     reader.onload = function(evt) { 
      console.log("Read " + file.name + " Successful"); 
     }; 
     reader.onloadend = function(evt) { 
      console.log("Read " + file.name + " Ending"); 
      endRead(evt.target.result); 
     }; 
     reader.onprogress = function(evt) { 
      console.log(evt.loaded + " of " + evt.total); 
     }; 
     reader.readAsText(file); 
    } 
    function endRead(value) { 
     strText = value; 
    } 
    //returns null value before file read finishes 
    return strText; 
}; 

Answer 1

文件系統API是異步的，這意味着你有一個回調傳遞給你的方法READFILE在讀取文件，該文件會被調用。這不是可以同步做，see this.

您可以將您的簽名改成這樣：

MyFile.prototype.readFile = function(fileDir, fileName, endRead) { 

並刪除以下行現在

function endRead(value) { 
    strText = value; 
} 
//returns null value before file read finishes 
return strText; 

，你可以傳遞函數作爲第三參數readFile方法並使用該函數的第一個參數訪問文件內容。