等待地理编码器功能完成执行，然后继续然后继续

Question

我正在使用Appgyver类固醇框架混合应用程序，我试图实现'检测用户位置'功能，从而用户可以切换开关以选择是否他们希望自动检测他们的位置（长& lat），或者他们可以将他们的位置（城市，邮政编码或县）输入到文本框中，经度和纬度将通过点击按钮来计算输入/选择。

当用户切换到“开”位置并点击提交时，navigator.geolocation.getCurrentPosition被触发并调用相关函数，然后将其当前的经度和纬度存储在localStorage中。这工作完美。但是，当用户将开关切换到'off'位置时，我的地理编码函数[manualGeoCode（）]将它们的位置编码为long和lat似乎没有及时触发，所以直接触发警报在它已经有实际设置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); 

Answer 1

请找到手柄和差异手动地理编码功能

$('#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.'); 
     } 
    }); 
}