jquery load()-无法加载谷歌地图


jquery load() - unable to load google maps

在JQuery中使用load()加载新页面的内容而不重新加载窗口时,我很难加载谷歌地图。

Jquery ajax调用是:

$("form").submit(function(){
        $(".cs-container").load("set-location.php .cs-container");
        return false;
    });

我正在尝试从当前div.cs-container类元素中的另一个set-location.php页面加载.cs-container的内容。它已成功加载,但谷歌地图没有加载g-maps容器放置在set-location.php页面的.cs-container中,其脚本文件包含在该页面的头部。

google maps工作得很好,但不会在ajax调用中加载。

当我尝试这样的东西时:

$("form").submit(function(){
            $(".cs-container").load("set-location.php");
            return false;
        });

它工作得很好,但它在.cs-container中加载了整个页面。我不想要的

谷歌地图初始化脚本为(在文件cs-loc.js中):

 /*check if geolocaiton supported*/
if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(success);
} else {
  error('Geo Location is not supported');
}


function success(position) {

   var lat = position.coords.latitude; /*getting cordinates*/
   var long = position.coords.longitude;
   var input = document.getElementById("latLong");
   input.value = lat + ", " + long;
   var poos = new google.maps.LatLng(lat,long); /*set lat long for maps*/
    var mapProp = {
      center: poos,
      zoom:16,
      mapTypeId:google.maps.MapTypeId.ROADMAP
    };
    var map=new google.maps.Map(document.getElementById("googleMap"),mapProp); /*init maps*/
    /*create marker*/
    var marker=new google.maps.Marker({
      position:poos,
      title: 'Your Store Location',
      draggable: true
      });
    marker.setMap(map); /*set marker to map*/
    google.maps.event.addListener(marker, 'dragend', function(a) {
        console.log(a);
        input.value = a.latLng.lat().toFixed(4) + ', ' + a.latLng.lng().toFixed(4);
    });

}

success();

如何解决?

您可以在load()回调中使用$.getScript()

$(".cs-container").load("set-location.php .cs-container", function(){
    $.getScript('google.maps....').done(function(){           
           $.getScript('cs-loc.js');
   });    
});