javascript - 等待 JS 函数中的异步调用结束。 (jQuery.延迟？)

Question

这是我的(简单)问题:

我有一个 Javascript 函数，它调用外部 API 以异步获取一些结果。我需要等待这些结果，因为我想对它们进行一些测试以确定它们是否有效，但是 Deferred 对我来说非常复杂，我无法成功。

这是我所做的:

$("#step-content").steps({
    //some parameters
    onStepChanging: function(event, currentIndex, newIndex) {
        verifyAddress().done(function(test) {
            if($("#hdnLatitude").val() == "" || $("#hdnLongitude").val() == "")
                test = false;
            else
                test = true;

            console.log(test); // test is true or false, that's good
            return test;
        });

        console.log(test); // test is always empty here

        //Here, I just need to do return true or return false to block step-changing if there is an error.
        return test;
    }
});

基本上，这是我的 verifyAddress 函数:

function verifyAddress() {
    var r = $.Deferred();

    var geocoder = new google.maps.Geocoder();
        if (geocoder) {
            var adressToGeocode = /* Get the address to geocode */

            geocoder.geocode({ 'address': adressToGeocode }, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) 
                {
                    //Save the lat/lng returned in #hdnLatitude and #hdnLongitude
                }

                r.resolve();
            });
        }
    //Not sure where to place the return r ; try elsewhere but no success
    return r;
}

所以我需要等待verifyAdress()结束并填充#hdnLatitude和#hdnLongitude，然后返回true onStepChanging 事件中的 false 来确定我们是否可以进入下一步(地址正确)或不(地址错误)

我正在使用this SO question为了更好地理解Deferred，但我无法成功。
有人可以帮助我吗？

非常感谢

Answer 1

你的函数应该是这样的:

function verifyAddress() {
    var r = $.Deferred();

    //call Google server to geocode my address. The call is asynchrounous.
    //The results are put in #hdnLatitude and #hdnLongitude fields.
    //The fields are correctly filled.
    googleFunc(someParam, function done(){
      r.resolve();
    });

    return r;
}

您必须在 Google 服务器函数调用的一些 done 回调中解析 deferred，必须有一些回调函数来处理结果。

var test = false; //Can't change step until allowed in async function   
$("#step-content").steps({
    //some parameters
    onStepChanging: function(event, currentIndex, newIndex) {
    if (!test)
      verifyAddress().done(function() {
            if($("#hdnLatitude").val() == "" || $("#hdnLongitude").val() == "")
                test = false;
            else
                test = true;

            console.log(test); // test is true or false, that's good

            //Auto move to next step if test is true
        });


        //Here, I just need to do return true or return false to block step-changing if there is an error.
        return test;
    }
});