使用$ .when执行第一个ajax然后执行$ .when()中的下一个。完成

时间:2017-02-06 13:19:23

标签: javascript jquery ajax

我知道这已被多次询问,但我在使用isServiceCopy = true时通过订单执行$.ajax时出现问题。

在下面的示例代码中,我想在$.when内运行第一个ajax,然后在$.when()内运行第二个$.ajax

.done()

当我运行代码时,第二个var api = { getFoo: function(callback) { $.when(this.getBar()).done(function() { chrome.storage.local.get(['bar'], function(data) { // omitted some code here for brevity $.ajax({ type: 'GET', url: /api/foo/, dataType: 'json' }).done(function(result) { console.log('success', 'went here!'); }).fail(function(request) { console.log('failed', 'went here!'); }); }); }); }, getBar: function() { chrome.storage.local.get(['data1'], function(data) { if(typeof data['data1'] !== 'undefined') { // omitted some code here for brevity $.ajax({ type: 'POST', url: /api/bar/, data: data['data1'], dataType: 'json' }).done(function(result) { console.log('success', 'went here!'); }).fail(function(xhr, status, error) { console.log('failed', 'went here!'); }); } }); } } 立即执行而不等待第一个$.ajax完成。请问,是否有人可以将我重定向到正确的方向?

2 个答案:

答案 0 :(得分:1)

我们需要回复异步行为的承诺 试试这个:

getFoo: function(callback) {
    this.getBar().then(function(){
        chrome.storage.local.get(['bar'], function(data) {
            // omitted some code here for brevity
            $.ajax({
                type: 'GET',
                url: /api/foo/,
                dataType: 'json'
            }).done(function(result) {
                console.log('success', 'went here!');
            }).fail(function(request) {
                console.log('failed', 'went here!');
            });
        });
    });
},
getBar: function() {
    var deferred = $q.defer();
    chrome.storage.local.get(['data1'], function(data) {
        if(typeof data['data1'] !== 'undefined') {
            // omitted some code here for brevity
            $.ajax({
                type: 'POST',
                url: /api/bar/,
                data: data['data1'],
                dataType: 'json'
            }).done(function(result) {
                deferred.resolve(result);
            }).fail(function(xhr, status, error) {
                deferred.reject(error);
            });
        }
    });
    return deferred.promise;
}

答案 1 :(得分:0)

jQuery - when()页上有一个很好的例子。这是一个简短的例子:

var api = {
    flag: $.Deferred(),
    getFoo: function(callback) {
        $.when(this.flag).done(function() {
            console.log('getFoo');
        });
    },
    getBar: function() {
        console.log('getBar');
        this.flag.resolve();
    }
}