Javascript 等待geocoder函数完成执行，然后继续

我正在使用Appgyver类固醇框架开发一个混合应用程序，我正在尝试实现一个“检测用户位置”功能，用户可以通过切换开关来选择是否希望自动检测他们的位置（long和lat），或者输入他们的位置（城市、邮政编码或县）输入到文本框中，单击按钮即可根据输入/选择计算经度和纬度

当用户将开关切换到“开”位置并点击提交时，

navigator.geolocation.getCurrentPosition

将被触发并调用相关函数，然后这些函数将其当前经度和纬度存储在

localStorage

中。这很好用

但是，当用户将开关切换到“关闭”位置时，my geocode函数[manuallyGeoCode（）]将其位置编码为long和lat，但似乎没有及时触发，因此在调用该geocode函数后，在有时间实际设置

localStorage

值之前，警报会立即触发。我研究了使用回调，并研究了使用jQuery

deferred

方法，这两种方法我都没有成功使用。任何帮助都将不胜感激！谢谢你的阅读

这是我的密码：

    <h3>Your location</h3>
      <ul class="list">
        <li class="item item-toggle">Use my current location
          <label class="toggle toggle-balanced">
            <input type="checkbox" id="myLocationToggle" checked="true">
            <div class="track">
              <div class="handle"></div>
            </div>
          </label>
        </li>
        <li class="item item-input">
          <input type="text" id="userLocation" placeholder="City, town or postcode" disabled="true">
        </li>
      </ul>

<button class="button button-balanced" id="getLongLat">Get long/lat</button>


$(function(){
  AutoGeoCode(); 
});

function AutoGeoCode(){
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(onSuccess, onError);
  }
}

$('#getLongLat').on('click',function(){
  localStorage.latToPost = '';
  localStorage.lngToPost = '';

  if(localStorage.userLatAutoDetected != '0' || localStorage.userLngAutoDetected != '0'){
    localStorage.latToPost = localStorage.userLatAutoDetected;
    localStorage.lngToPost = localStorage.userLngAutoDetected;
  }
  else{
    manuallyGeoCode(); // this doesn't finish in time so it jumps to the alert below and shows empty values.
  }

  alert('geodata is: {'+localStorage.latToPost+'}, {'+localStorage.lngToPost+'}');

});

$('#myLocationToggle').on('click',function(){
  if($(this).is(':checked')){
    $('#userLocation').val('').prop('disabled',true);
    AutoGeoCode();
  }
  else{
    $('#userLocation').val('').prop('disabled',false);
    localStorage.userLatAutoDetected = '0';
    localStorage.userLngAutoDetected = '0';
  }
});

function onSuccess(position){
    localStorage.userLatAutoDetected = position.coords.latitude;
    localStorage.userLngAutoDetected = position.coords.longitude;
}

function onError(error){
  alert('current location could not be auto detected. Error: ' + error);
}

//Autocomplete location search box
function initialize() {
  var address = (document.getElementById('userLocation'));
  var autocomplete = new google.maps.places.Autocomplete(address);
      autocomplete.setTypes(['geocode']);
  google.maps.event.addListener(autocomplete, 'place_changed', function() {
  var place = autocomplete.getPlace();
    if (!place.geometry) {
      return;
    }
  var address = '';
    if (place.address_components) {
      address = [
                  (place.address_components[0] && place.address_components[0].short_name || ''),
                  (place.address_components[1] && place.address_components[1].short_name || ''),
                  (place.address_components[2] && place.address_components[2].short_name || '')
                ].join(' ');
    }
  }); //end google.maps.event
}

function manuallyGeoCode(){
  var address = $('#userLocation').val();
  geocoder = new google.maps.Geocoder();
    geocoder.geocode({'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        localStorage.latToPost = results[0].geometry.location.lat();
        localStorage.lngToPost = results[0].geometry.location.lng();
      }
      else {
        alert('Your location could not be geocoded.');
      }
    });
}

google.maps.event.addDomListener(window, 'load', initialize);

您的位置

使用我的当前位置




变长/变宽
$（函数（）{
自动地理编码（）；
});
函数AutoGeoCode（）{
if（导航器.地理位置）{
navigator.geolocation.getCurrentPosition（onSuccess，onError）；
}
}
$（'getLongLat'）。在（'click'，function（）上{
localStorage.latToPost=''；
localStorage.lngToPost=''；
if（localStorage.userLatAutoDetected！=“0”| | localStorage.userLngAutoDetected！=“0”）{
localStorage.latToPost=localStorage.userLatAutoDetected；
localStorage.lngToPost=localStorage.userLngAutoDetected；
}
否则{
manuallyGeoCode（）；//此操作未及时完成，因此它会跳转到下面的警报并显示空值。
}
警报（'地理数据为：{'+localStorage.latToPost+'}，{'+localStorage.lngToPost+'}'）；
});
$（'#myLocationToggle'）。打开（'单击'，函数（）{
如果（$（this）.is（':checked'））{
$（'#userLocation'）.val（'.prop（'disabled'，true）；
自动地理编码（）；
}
否则{
$（'#userLocation'）.val（'.prop（'disabled'，false）；
localStorage.userLatAutoDetected='0'；
localStorage.userLngAutoDetected='0'；
}
});
成功时的功能（位置）{
localStorage.userLatAutoDetected=position.coords.latitude；
localStorage.userLngAutoDetected=position.coords.longitude；
}
函数onError（错误）{
警报（'无法自动检测到当前位置。错误：'+错误）；
}
//自动完成位置搜索框
函数初始化（）{
var address=（document.getElementById（'userLocation'）；
var autocomplete=new google.maps.places.autocomplete（地址）；
setTypes（['geocode']）；
google.maps.event.addListener（自动完成，'place\u changed'，函数（）{
var place=autocomplete.getPlace（）；
如果（！place.geometry）{
返回；
}
var地址=“”；
if（位置、地址和组件）{
地址=[
（place.address_components[0]&&place.address_components[0]。简称| | |“”），
（place.address_components[1]&&place.address_components[1]。简称| | |“”），
（place.address_components[2]&&place.address_components[2]。简称| |“”）
].加入（“”）；
}
})；//结束google.maps.event
}
功能手册地理代码（）{
var address=$（'#userLocation'）.val（）；
geocoder=新的google.maps.geocoder（）；
geocoder.geocode（{'address'：address}，函数（结果，状态）{
if（status==google.maps.GeocoderStatus.OK）{
localStorage.latToPost=results[0]。geometry.location.lat（）；
localStorage.lngToPost=结果[0]。geometry.location.lng（）；
}
否则{
警报（'您的位置无法进行地理编码'）；
}
});
}
google.maps.event.addDomListener（窗口“加载”，初始化）；

请找出手柄和手动地理编码功能的区别

$('#getLongLat').on('click',function(){
  localStorage.latToPost = '';
  localStorage.lngToPost = '';

  if(localStorage.userLatAutoDetected != '0' || localStorage.userLngAutoDetected != '0'){
    localStorage.latToPost = localStorage.userLatAutoDetected;
    localStorage.lngToPost = localStorage.userLngAutoDetected;
    alert('geodata is: {'+localStorage.latToPost+'}, {'+localStorage.lngToPost+'}');
  }else{
    manuallyGeoCode(function(){
      alert('geodata is: {'+localStorage.latToPost+'},{'+localStorage.lngToPost+'}');

    }); // this doesn't finish in time so it jumps to the alert below and shows empty values.
  }
});

function manuallyGeoCode(cb){
  var address = $('#userLocation').val();
  geocoder = new google.maps.Geocoder();
    geocoder.geocode({'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        localStorage.latToPost = results[0].geometry.location.lat();
        localStorage.lngToPost = results[0].geometry.location.lng();
        cb();
      }
      else {
        alert('Your location could not be geocoded.');
      }
    });
}

---

向manuallyGeoCode发送差异回调，并在geocoder中调用相同的回调。geocode的回调应help@Sunand-我刚刚尝试过，它仍然会触发警报并生成“geodata is:{}，{}”。是因为我在if{}..else{}..中调用

manuallyGeoCode（）

。。block？当我在if{}..else{}之外发出警报时，这会警告正确的地理数据。。它仍然显示警报，但没有地理数据。这有意义吗？原因是，我想通过ajax将本地存储数据发布到我的web服务中。因此，无论您在哪里使用alert，都会使用一个自定义函数将这些值作为参数并发送请求。感谢您的帮助。问题是，当我在

if else

块之后放置

$.ajax

请求时，

ajax

块将在

manuallyGeoCode

有机会回调地理数据并将这些值存储在

localStorage

之前执行。