在 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 map
工作得很好,但无法在 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');
});
});
关于javascript - jquery load() - 无法加载谷歌地图,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38543000/