Javascript Jquery表单提交，异步调用成功后再提交表单

我正在尝试在提交表单之前将地址的lat-long插入表单中

这是我的密码：

 var success = false;
var getLat = 0;
var getLng = 0;

function getLngLat() {
    var address = $(".save-new-address").val();
    if(!address) return false;
    if(success) return false;

    var geocoder = new google.maps.Geocoder();
    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            console.log(results);
            map.setCenter(results[0].geometry.location);
            success = true;
            var newMarker = new google.maps.Marker({
                position: results[0].geometry.location,
                map: map  
            });
            $(".save-new-lat").val(results[0].geometry.location.lat);
            $(".save-new-lng").val(results[0].geometry.location.lng);
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        };                                        
    });
}


$("form#save-new-restaurant").submit(function () {
    getLngLat();
    if(success) { 
        return true;
    } else {
        getLngLat();
        $("form#save-new-restaurant").submit();
        return false;   
    }
});

大部分内容都是从谷歌开发者页面复制的。但是我发现要么表单提交太快，要么在上述函数完成后检索详细信息

---

我只是想在提交表单时从谷歌获取数据，当我获得数据后，我想提交表单。我怎样才能做到这一点？

您可以使用延迟对象

然后在其他代码中

function getLngLat() {
    //stuff
    var deferred = $.Deferred();
    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
           //do stuff
           deferred.resolve();
        } else {
            deferred.reject();
        }
    }
    return deferred;
 }

试试这个

var success = false;
var getLat = 0;
var getLng = 0;

function getLngLat() {
    var address = $(".save-new-address").val();
    if(!address) return false;
    if(success) return false;

    var geocoder = new google.maps.Geocoder();
    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            console.log(results);
            map.setCenter(results[0].geometry.location);
            success = true;
            var newMarker = new google.maps.Marker({
                position: results[0].geometry.location,
                map: map  
            });
            $(".save-new-lat").val(results[0].geometry.location.lat);
            $(".save-new-lng").val(results[0].geometry.location.lng);

            $("form#save-new-restaurant").unbind("submit"); // unbinding event so getLngLat doesn't execute again
            document.getElementById('save-new-restaurant').submit();
            $("form#save-new-restaurant").bind("submit", formSubmitCallBack); // attaching event for further uses if require
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        };                                        
    });
}


$("form#save-new-restaurant").bind("submit", formSubmitCallBack);

function formSubmitCallBack() {
    getLngLat();
    return false;
}

---

希望这会有帮助

我喜欢这个主意，但我不能让它发挥作用？它正在提交带有空白lng/lats的表格。

var success = false;
var getLat = 0;
var getLng = 0;

function getLngLat() {
    var address = $(".save-new-address").val();
    if(!address) return false;
    if(success) return false;

    var geocoder = new google.maps.Geocoder();
    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            console.log(results);
            map.setCenter(results[0].geometry.location);
            success = true;
            var newMarker = new google.maps.Marker({
                position: results[0].geometry.location,
                map: map  
            });
            $(".save-new-lat").val(results[0].geometry.location.lat);
            $(".save-new-lng").val(results[0].geometry.location.lng);

            $("form#save-new-restaurant").unbind("submit"); // unbinding event so getLngLat doesn't execute again
            document.getElementById('save-new-restaurant').submit();
            $("form#save-new-restaurant").bind("submit", formSubmitCallBack); // attaching event for further uses if require
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        };                                        
    });
}


$("form#save-new-restaurant").bind("submit", formSubmitCallBack);

function formSubmitCallBack() {
    getLngLat();
    return false;
}