Question

我需要一个解决方案来控制javascript中的代码执行。我希望不要执行下一行的代码，除非当前行上的代码完全执行。有没有解决方案？

function handleFileSelect(evt) {
    var files = evt.target.files;

    for (var i = 0; i < files.length; i++) {
        alert("for");
        f = files[i];
        fileExtension = f.name.split('.').pop();    

        if(fileExtension != 'kml' && fileExtension !='kmz' && fileExtension != 'csv'){
            alert('Unsupported file type ' + f.type + '(' + fileExtension + ')');
            return;
        }       

        var fileReaderkmlcsv = new FileReader();                        
        fileReaderkmlcsv.onloadend = loadend;
        fileReaderkmlcsv.onerror = function(event) {
            alert("ERROR: " + event.target.error.code);
        };          
        fileReaderkmlcsv.readAsText(f);             
    } //- end for
} //handleFileSelect

function loadend(theFile) {
    alert("loadend");
    //code for processing my files
}

Answer 1

问题是，只要loadend中的任何一个已完成加载，FileReader就会正在运行。您需要重新设计代码以等待所有3个代码完成，例如：

function handleFileSelect(evt) {    
    var files = evt.target.files;    
    var fileReaders = [];
    var loadCount = 0;

    for (var i = 0; i < files.length; i++) {
        f = files[i];
        fileExtension = f.name.split('.').pop();   

        if(fileExtension != 'kml' && fileExtension !='kmz' && fileExtension != 'csv'){
            alert('Unsupported file type ' + f.type + '(' + fileExtension + ')');
            return;
        }

        function fileLoaded() {
            loadCount++;
            //Check if we've loaded all the files
            if (loadCount == files.length) {
                loadend(fileReaders);
            }
        }

        var fileReaderkmlcsv = new FileReader();                        
        fileReaderkmlcsv.onloadend = fileLoaded;
        fileReaderkmlcsv.onerror = function(event) {
            alert("ERROR: " + event.target.error.code);
        };          
        fileReaderkmlcsv.readAsText(f);
        fileReaders.push(fileReaderkmlcsv);
    }
  }

function loadend(files) {
    //files now contains an array of completed FileReader objects
}

请注意，我没有直接体验FileReader对象本身 - 如果onloadend在发生错误时没有触发，那么你也需要在onerror事件中加入类似的逻辑确保loadCount变量仍然增加/检查等。

在JavaScript中异步执行任何控制执行的解决方案？

1 个答案: