一个接一个地执行2个异步AJAX请求

时间:2014-01-07 17:29:02

标签: javascript php jquery ajax

首先,我知道标题似乎与自己相矛盾。

但是,我的问题是我想要一个接一个地调用2个AJAX函数,或者只调用第二个函数。

让我把它放到上下文中。我正在写一个“商店定位器”应用程序。默认情况下,所有结果都按字母顺序加载。用户可以将他们的地址或邮政编码输入到框中并点击搜索。然后我的应用程序将使用Google的地理编码API从输入中找到他们的纬度和经度坐标,然后将这些坐标传递给我自己的AJAX调用,然后根据他们的位置,最近的商店排序结果。

但是,如果用户没有输入邮政编码,我想回到默认设置并再次按字母顺序显示结果。

到目前为止......

    function generateResults(_postcode) {
        //console.log("generating results");
        if (readyState) {
            changeReadyState(false);
            jQuery.ajax({
                url: "http://maps.googleapis.com/maps/api/geocode/json?address=" + encodeURIComponent(_postcode) + ",UK&sensor=false",
                success: function(d){
                    var _u = ajax_url;

                    if (d.results && d.results[0] && d.results[0].geometry && d.results[0].geometry.location) {
                        var location = d.results[0].geometry.location;
                        _u = appendQS(_u, "lat=" + location.lat); // Appends as query string, putting either ? or & before
                        _u = appendQS(_u, "lng=" + location.lat);

                        jQuery.ajax({
                            url: _u,
                            success: function(data){

                                changeReadyState(true);
                            },
                            error: function(){
                                changeReadyState(true);
                            },
                            async: false
                        });
                    }
                    else if (d.error_message) {
                        alert(d.error_message);
                        changeReadyState(true);
                    }
                    else {
                        alert("No results found for '" + _postcode + "'");
                        postcodeTxt.val("");
                        changeReadyState(true);
                    }

                },
                error: function(){
                    changeReadyState(true);
                }
            });
        }
        else {
            //console.log("Application busy, try again soon");
        }
    }

我想我可能只有两个案例取决于_postcode是否为空,但这意味着重复代码。

基本上我只想在_postcode字段不为空的情况下调用Google地理编码API,但我想确保此调用要么没有进行,要么在我调用自己的AJAX之前完成。

我看过第一个请求是同步的,但根据jQuery文档,它已被弃用,他们建议使用他们的成功/错误/完整回调。

我觉得这一天有点晚了!

干杯

1 个答案:

答案 0 :(得分:0)

尝试类似:

$.when(
    $.get('path1', function(d1) {
        // do stuff with first request data
    }, 'datatype')
).then(function() {
    $.get('path2', function(d2) {
        // do stuff with second request data
    }, 'datatype')
}, function(o,e,m) {
    // handle errors
});

如果你愿意,你甚至可以做更多的ajax调用。