相关疑难解决方法(0)

如何使函数等到所有jQuery Ajax请求在另一个函数内完成？

简而言之,我需要等待所有Ajax请求在执行下一个之前完成.但是怎么样？

这是一个人为的例子:http://jsfiddle.net/adamjford/YNGcm/20/

HTML:

<a href="#">Click me!</a>
<div></div>

JavaScript的:

function getSomeDeferredStuff() {
    var deferreds = [];

    var i = 1;
    for (i = 1; i <= 10; i++) {
        var count = i;

        deferreds.push(
        $.post('/echo/html/', {
            html: "<p>Task #" + count + " complete.",
            delay: count
        }).success(function(data) {
            $("div").append(data);
        }));
    }

    return deferreds;
}

$(function() {
    $("a").click(function() {
        var deferreds = getSomeDeferredStuff();

        $.when(deferreds).done(function() {
            $("div").append("<p>All done!</p>");
        });
    });
});

我想要"全部完成!" 在所有延迟任务完成后$.when()出现,但似乎不知道如何处理Deferred对象数组."全部完成!" 首先发生的是因为数组不是Deferred对象,所以jQuery继续并假设它刚刚完成.

我知道可以将对象传递给函数,$.when(deferred1, deferred2, ..., deferredX) …

我目前正在尝试使用HTML5 FileAPI构建文件上传器.如果文件是图像,则文件上载器应该处理多个文件并显示图像预览.

由于FileReader类异步工作,我想等到所有文件都被读取.因此我使用Deferreds.

读取文件的方法返回一个promise.另一种方法遍历所有文件并将所有promises推送到数组中.然后,我将所有promises添加到我的数组后应用then()方法.

现在我的问题.因为then()方法只被调用一次,所以我得到了所有的承诺.我没有机会处理每一个承诺.我想要做的是,一旦它们全部存在并且返回结果,就循环我所有的承诺.

这是我的FileProcessor对象

read: function(file) {
    var reader = new FileReader();
    var deferred = $.Deferred();

    reader.onload = function(event){
        deferred.resolve(event.target.result);
    };

    reader.onerror = function() {
        deferred.reject(this);
    }

    if(/^image/.test(file.type))
        reader.readAsDataURL(file);

    return deferred.promise();
},

这里是FileManager对象的handleFileSelect()方法,它应该调用FileProcessor.read()方法.

handleFileSelect: function(e){
    var $fileList = $('#file-list');

    var files = e.target.files;
    var promises = []; //Promises are going to be stored here
    var filestring = '';

    var processedFile;

    // Loop trough all selected files
    for(var i = 0; i < …