Question

我想提交一个表单，一旦我收到地理编码结果，用户端地理编码调用google api：

var geocoder;
geocoder = new google.maps.Geocoder();

function codeAddress(address, form) {

    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            alert(results[0].geometry.location);

            document.getElementById("latitude").value = location[0];
            document.getElementById("longitude").value = location[1];
            return validate2(form);
        } else {
            alert('Geocode was not successful for the following reason: ' + status);
        }
    });
}

编辑：根据请求，这里是其他2个函数的代码：

<form method='post' action='profile.php' onSubmit='return validate(this)' name='signup'>

onSubmit调用validate（form）调用地理编码函数：

function validate(form)
{
return codeAddress(form.streetNumN.value +" " +form.streetN.value+" "+form.streetTypeN.value+", "+form.cityN.value +", "+form.stateN.value+" "+form.zipN.Value, form);
}

function validate2(form)
      {var fail = !form.firstNameN.value + !form.lastNameN.value +  !form.phoneN.value +  !form.emailN.value + !form.passN.value + !form.pass2N.value  + !form.emailN.value + !form.streetNumN.value + !form.streetN.value +  !form.streetTypeN.value + !form.cityN.value + !form.stateN.value + !form.zipN.value; 

     if(form.firstNameN.value.length == 0)
         {
         document.getElementById("firstNameP").innerHTML="Please enter your first name.";
         }       

         if(form.lastNameN.value.length == 0)
         {
         document.getElementById("lastNameP").innerHTML="Please enter your last name.";
         }
    ...etc...
    if(fail>0)
    return false;
    else 
    return true;            
    }

validate2（form）确保填写所有字段，如果表单填写正确则返回true，否则返回false。

使用validate（form）简单地返回validate2（表单）工作正常。但是使用validate（form）返回地理编码（...），假设在其完成任务中调用validate2（form）有问题....表单只是提交而不等待地理编码或者validate2（表单）返回

停止表单提交是使codeAddress函数返回false

var geocoder;
  geocoder = new google.maps.Geocoder();

function codeAddress(address, form) {

  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
        alert(results[0].geometry.location);
alert('hi from geocode completion');
document.getElementById("latitude").value = results[0].geometry.location[0];
document.getElementById("longitude").value = results[0].geometry.location[1];
//return false;
return validate2(form);
   } else {
      alert('Geocode was not successful for the following reason: ' + status);
    }
  });
return false;
}

在主体中除了完成处理程序。所以我认为这个函数必须在完成处理程序运行之前返回，因此提交了表单。如何阻止此功能返回？（我也试过运行函数而不是把它们写成返回。所以只有validate2（form）函数返回结束。在这种情况下，一切都有时间运行但是表单提交无论validate2（表单）是什么实际上是回归。

我想要做的是经常做的。不知道为什么我找不到模板，如果有人有一些示例代码或建议来查找示例代码，那将非常感激。

Answer 1

如何让codeAddress函数完全阻止返回任何内容，直到数据准备就绪？

您需要将代码放在要提供给地理编码功能的匿名回调函数中。在那个时间点谷歌将要返回的所有地理编码数据都已准备就绪。它显式调用您提供的回调函数，并将结果和状态参数传递给它。

看起来，在大多数情况下，这就是你正在做的事情。在codeAddress函数的第二个片段中，你有一个迷路的“返回false”，这确实会导致该函数过早返回，并且每次都会导致表单提交失败（如果你的代码的其余部分按你的意图运行））。

此外，如果您尝试从结果中检索纬度和经度值，则您的呼叫应为：

document.getElementById("latitude").value = results[0].geometry.location.lat() 
document.getElementById("longitude").value = results[0].geometry.location.lng()

这是一个小提琴（大部分来自其他地方），希望能回答其中一些问题，并澄清何时可获得结果：

http://jsfiddle.net/q7f6mpxz/3/

客户端地理编码后表单提交的异步问题 - 即使validate函数返回false，表单也始终提交

1 个答案: