我有一个地方自动完成对象在我的搜索框。
var navbarAutocomplete = new window.google.maps.places.Autocomplete(navbarInput, navbarOptions);
我还为'place_changed'设置了一个监听器事件,并在其中调用maps。geocoder对字符串进行搜索,如果自动完成没有任何结果。我担心的是,如果地理代码永远不会返回(例如链接下降),我卡住不调用表单提交。问题-我应该有一个定时器设置,所以如果过了一定的时间,如果地理编码的结果还没有回来,我可以超时和调用表单提交?如果有,我该怎么做呢?我担心的是,如果我超时调用表单提交,那是1个调用,然后地理编码结果返回并提交,那是2个调用。
这是我的事件监听器。
google.maps.event.addListener(navbarAutocomplete, 'place_changed', function() {
var searchedPlace = navbarAutocomplete.getPlace();
if (searchedPlace.geometry === undefined) {
$("#latitude").val(searchedPlace.geometry.location.G);
$("#longitude").val(searchedPlace.geometry.location.K);
$("#mapType").val(searchedPlace.types[0]);
$('form')[0].submit();
} else {
var navbarGeocoder = new google.maps.Geocoder();
navbarGeocoder.geocode({
'address': navbarInput.value
}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
$("#latitude").val(results[0].geometry.location.G);
$("#longitude").val(results[0].geometry.location.K);
$("#mapType").val(results[0].types[0]);
}
$('form')[0].submit();
});
}
});
您可以在提交geocode请求之前启动计时器,并让计时器设置一个标志,以便geocode请求在执行其代码之前进行检查。
如果geocode在计时器之前成功运行,则运行clearTimeout
以阻止计时器执行。
google.maps.event.addListener(navbarAutocomplete, 'place_changed', function() {
var searchedPlace = navbarAutocomplete.getPlace();
if (searchedPlace.geometry === undefined) {
$("#latitude").val(searchedPlace.geometry.location.G);
$("#longitude").val(searchedPlace.geometry.location.K);
$("#mapType").val(searchedPlace.types[0]);
$('form')[0].submit();
} else {
var navbarGeocoder = new google.maps.Geocoder();
var timedOut = false; // indicates if timer code has run
var timerId = setTimeout(function() {
timedOut = true;
// submit form
}, 10000);
navbarGeocoder.geocode({
'address': navbarInput.value
}, function(results, status) {
if (false === timedOut && status == google.maps.GeocoderStatus.OK) {
clearTimeout(timerId); //prevent timer code from running
$("#latitude").val(results[0].geometry.location.G);
$("#longitude").val(results[0].geometry.location.K);
$("#mapType").val(results[0].types[0]);
}
$('form')[0].submit();
});
}
});
我想这样做可能会起作用
google.maps.event.addListener(navbarAutocomplete, 'place_changed', function() {
var searchedPlace = navbarAutocomplete.getPlace();
if (searchedPlace.geometry === undefined) {
$("#latitude").val(searchedPlace.geometry.location.G);
$("#longitude").val(searchedPlace.geometry.location.K);
$("#mapType").val(searchedPlace.types[0]);
$('form')[0].submit();
} else {
var timedOut = false;
var formSubmitted = false;
var navbarGeocoder = new google.maps.Geocoder();
navbarGeocoder.geocode({
'address': navbarInput.value
}, function(results, status) {
if (!timedOut) {
if (status == google.maps.GeocoderStatus.OK) {
$("#latitude").val(results[0].geometry.location.G);
$("#longitude").val(results[0].geometry.location.K);
$("#mapType").val(results[0].types[0]);
}
formSubmitted = true;
$('form')[0].submit();
}
});
var timerId = setTimeout(function() {
timedOut = true;
alert('Request timed out.');
if (!formSubmitted) {
$('form')[0].submit();
}
}, 3000);
}
});
这是我的工作解决方案。
google.maps.event.addListener(navbarAutocomplete, 'place_changed', function() {
var searchedPlace = navbarAutocomplete.getPlace();
if (searchedPlace.geometry === undefined) {
$("#latitude").val(searchedPlace.geometry.location.G);
$("#longitude").val(searchedPlace.geometry.location.K);
$("#mapType").val(searchedPlace.types[0]);
$('form')[0].submit();
} else {
var navbarGeocoder = new google.maps.Geocoder();
var timedOut = false; // indicates if timer code has run
var timerId = setTimeout(function() {
timedOut = true;
// submit form
$('form')[0].submit();
}, 3000);
navbarGeocoder.geocode({
'address': navbarInput.value
}, function(results, status) {
if (timedOut === false) {
clearTimeout(timerId);
if (status == google.maps.GeocoderStatus.OK) {
$("#latitude").val(results[0].geometry.location.G);
$("#longitude").val(results[0].geometry.location.K);
$("#mapType").val(results[0].types[0]);
}
$('form')[0].submit();
}
});
}
});