Question

我有一个jQuery脚本，它通过Ajax调用将一个zipcode转换为latitude＆amp;经度。从隐藏的输入字段中检索zipcode。那部分工作正常。而ajax结果给出了正确的纬度/长度。

一段HTML

<input id="zipcode" type="hidden" value="1010AK">

jQuery中的Ajax调用：

jQuery(document).ready(function($){     
       var zipcode = jQuery('input#zipcode').val();    
       $.ajax({
       url: "http://maps.googleapis.com/maps/api/geocode/json?address=netherlands&components=postal_code:"+zipcode+"&sensor=false",
       method: "POST",
       success:function(data){
             latitude = data.results[0].geometry.location.lat;
             longitude= data.results[0].geometry.location.lng;
             coords = latitude+','+longitude;
             //console.log(coords);
           }    
      });   
});

在文档就绪函数的外部（下面）我有一个initialize（）函数，我希望能够将coords var传递给该函数，这样我就能获得正确的纬度和经度。

初始化函数（在ajax调用之后）：

    function init() {
      var mapOptions = {
          zoom: 11,            
          center: new google.maps.LatLng(/* COORDS VAR */)
      };

      var mapElement = document.getElementById('my_map');
      var map = new google.maps.Map(mapElement, mapOptions);

      var image = '/wp-content/themes/example/img/foo.png';
      var myLatLng = new google.maps.LatLng(/* COORDS VAR */);
      var customMarker = new google.maps.Marker({
          position: myLatLng,
          map: map,
          icon: image
      });
   }
   google.maps.event.addDomListener(window, 'load', init);

我尝试了很多事情，但我摔跤太久了。我基本上认为我可以将coords var传递给init函数，如下所示：

function init(coords){}
google.maps.event.addDomListener(window, 'load', function(){initialize(coords);});

我还尝试设置ajax async: false，并添加dataType: 'json'，但这并没有给我机会传递给init函数。

Answer 1

您遇到的问题是，在您的AJAX请求返回之前，init()已经运行（感谢挂钩window.load）。您需要删除该挂钩，并在init处理程序中手动调用success。试试这个：

jQuery(document).ready(function($){     
    var zipcode = jQuery('input#zipcode').val();    
    $.ajax({
        url: "http://maps.googleapis.com/maps/api/geocode/json",
        data: {
            address: 'netherlands',
            components: 'postal_code:' + zipcode,
            sensor: false
        },
        method: "POST",
        success: function(data){
            var lat = data.results[0].geometry.location.lat;
            var lng = data.results[0].geometry.location.lng;
            init(lat, lng);
        }    
    });   
});

function init(lat, lng) {
    var latlng = new google.maps.LatLng(lat, lng);
    var mapOptions = {
        zoom: 11,            
        center: latlng
    };

    var map = new google.maps.Map($('#my_map')[0], mapOptions);
    var customMarker = new google.maps.Marker({
        position: latlng,
        map: map,
        icon: '/wp-content/themes/decevents/img/marker_darkblue.png'
    });
}

传递Lat Lng var以初始化函数谷歌地图

1 个答案: