通过AJAX加载Google Maps API,控制台错误

时间:2014-11-30 17:39:03

标签: javascript php jquery ajax google-maps-api-3

我正在使用jquery / javascript,ajax和php构建一个完全动态的网站。

当我点击导航链接时,浏览器会使用ajax打开该页面。

所以基本上所有页面都在同一个index.php中加载。

如果我转到“位置”标签,我有谷歌地图,它会动态加载谷歌地图脚本(向主体添加脚本标签)。

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&amp;callback=initialize"></script>

此脚本由前一个脚本

自动加载
<script src="https://maps.gstatic.com/maps-api-v3/api/js/19/1/intl/hr_ALL/main.js"></script>

当我离开“位置”页面时,我会检查脚本是否存在并将其删除。

如果我在没有刷新页面的情况下回到“位置”,我认为地图会有一个干净的开始,但我在控制台中收到此错误:

  

您已在此页面上多次添加Google Maps API。   这可能会导致意外错误。

即使以前删除了脚本,并且地图和内容已更改为其他内容,我也会收到该错误。

因为我知道我只有一次地图实例,我应该忽略它吗?

或者它确实对旧地图有某种引用,删除这两个脚本是不够的。

感谢您提供任何信息!

1 个答案:

答案 0 :(得分:9)

删除脚本元素不会删除这些脚本创建的对象(基本上它不会产生任何影响)。

检查maps-API是否已经加载:

<script>
jQuery(function(){
if(!window.google||!window.google.maps){
  var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = 'https://maps.googleapis.com/maps/api/js?v=3&' +
        'callback=initialize';
    document.body.appendChild(script);
}
else{
  initialize();
}});
</script>