Question

如何等待onload事件完成

function(){

var filedata=null;     
reader.onload=function(e){
filedata=e.target.result;
};
reader.readAsBinaryString(file);

//I need code to wait till onload event handler gets completed.
return filedata;
}

Answer 1

对此的典型解决方案是将代码分开，以便使用加载数据的部分位于单独的函数中，然后从事件中调用该函数。

伪code'ish：

function load() {
    //load here
    reader.onload = function(e) {
        process(e.target.result);
    }
}

function process(result) {
    //finish working here
}

Answer 2

您可以使用线程同步读取（Javascript中的Webworkers）。

http://www.w3.org/TR/FileAPI/#readingOnThreads

Answer 3

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>

<form><input type="file" id="files" name="file" onchange="upload()" /></form>

function readFile(dfd) {
    bytes = [];
    var files = document.getElementById('files').files;
    if (!files.length) {
        alert('Please select a file!');
        return;
    }
    var file = files[0];
    var reader = new FileReader();

    // If we use onloadend, we need to check the readyState.
    reader.onloadend = function(evt) {
        if (evt.target.readyState == FileReader.DONE) { // DONE == 2
            var content = evt.target.result;
            //bytes = stringToBytes(content);
            dfd.resolve(content);
        }
    };
    reader.readAsBinaryString(file);
}

function upload() {
    var dfd = new $.Deferred();
    readFile(dfd);
    dfd.done(function(content){
        alert("content:" + content);
    });
}

Answer 4

Jani的答案是正确的，但是如果在droparea中一次删除多个文件，则每个文件都没有单独的事件（据我所知）。但是这个想法可能用于通过递归同步加载文件。在下面的代码中，我加载了多个文件，并将它们的内容连接成一个字符串，以便进一步处理。

var txt="", files=[];
function FileSelectHandler(e) {
    e.preventDefault();
    files = e.target.files || e.dataTransfer.files;
    txt=""; 
    readFile(0);
}

function readFile(n) {
    file=files[n];
    var reader = new FileReader();
    reader.onload = function() {
        txt += reader.result;
    }
    reader.readAsText(file);
    if (n<files.length-1) { readFile(n+1); }
    else { setTimeout(doWhatEver, 100);}
}

function doWhatEver(){
    outtext.innerHTML=txt; 
}

最后一个文件还需要一些额外的时间来加载。因此“setTimeout”。

“outtext”是textarea的句柄，显示整个字符串。在textarea输出时，浏览器不会解析字符串。这样不仅可以查看文本，还可以查看html，xml等。

Answer 5

不，没有。所有IO操作在Javascript中必须是异步的。

使文件操作同步将有效地阻止浏览器UI线程冻结浏览器。用户不喜欢这样。

相反，您需要以异步方式设计脚本。用Javascript很容易。

在HTML5中有任何方法可以使Filereader readAsBinaryString（）同步

5 个答案: