如何处理多个异步请求？

Question

我有两个请求，一个是加载图像（后端服务器会花费很多时间），另一个是ajax。 我要像以下：

$.when(
    [do image load] 
    [do ajax] 
).then(
    alert('all complete') 
) 

然而，$。当和然后使用多个Ajax请求，如何处理与Ajax和图像加载

Answer 1

$.when(
    $.get("/ajax/", function(response) { 
    //process ajax 
    }), 
    $.get("/assets/image.png", function(image) { 
    // process image 
    }), 
).then(function() { 
    // All is ready now, so... 
    alert('all complete') 
}); 

Answer 2

我想建议Gauri的imgLoad插件从jQuery callback on image load (even when the image is cached)

/** 
* Trigger a callback when 'this' image is loaded: 
* @param {Function} callback 
*/ 
(function($){ 
    $.fn.imgLoad = function(callback) { 
     return this.each(function() { 
      if (callback) { 
       if (this.complete || /*for IE 10-*/ $(this).height() > 0) { 
        callback.apply(this); 
       } 
       else { 
        $(this).on('load', function(){ 
         callback.apply(this); 
        }); 
       } 
      } 
     }); 
    }; 
})(jQuery); 

用法，

$('#img-if').imgLoad(function(){ 
    // inside the image complete callback 
    $.ajax({ 
     .... 
     success:function(response){ 
      // final code to be executed here 
     } 
    }) 
});