Question

我的代码中有一个ajax请求，如下所示：

function show_detail()
{

     $('#product_'+index).html('<img src="/loading.jpg" style="margin-left:450px;"> loading...');
    $.ajax({
        type: "GET",
        url: "someUrl",
        data: dataString,
        success: function(msg){
            $('#product_'+index).html(msg);
        }

    });
}

我的要求是在单击一组产品图像中的任何产品图像时调用函数show_detail（），并在div中显示加载图像，直到从ajax请求完全加载产品的详细信息。当从ajax请求加载产品详细信息时，我将用产品详细信息覆盖相同的div。但问题是当同时单击多个链接时，我将获得多个加载图像的后续div。所以我想等到最后一个ajax请求完成后再调用相同的函数（show_detail（））并一次只显示一个加载图像。另外，我不想使用async冻结浏览器：false

提前致谢。

Answer 1

jQuery.when（）提供了一种基于一个或多个对象执行回调函数的方法，通常是表示异步事件的Deferred对象。它使得语法干净清晰，并且避免涉及任何全局变量，例如ajaxStart和ajaxStop，这些变量可能会在页面开发时产生不必要的副作用。以下显示了一个小例子。尝试阅读有关它的更多信息... :)

var req1 = $.ajax({...});
var req2 = $.ajax({...});
var req3 = $.ajax({...});

$.when( req1, req2, req3 ).done(function(){
    console.log("all done")
});

<强> FYI

<强> jQuery.when()

在频繁调用具有ajax请求的函数时，如何在处理下一个请求之前等待最后一个ajax请求完成？

1 个答案: