通过AJAX载入Google地图API，控制台错误 [英] Loading Google Maps API via AJAX, console error

问题描述

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

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

如果我转到'Location '标签，在那里我有一个谷歌地图，它会动态地加载Google地图脚本（为脚本添加脚本标签）。

 < script type =text / javascriptsrc =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 >< /脚本> 
  

当我离开'位置'页面时，我检查脚本是否存在并删除它们。 / p>

如果我没有刷新页面而返回位置，我认为地图会有一个干净的开始，但是在控制台中出现此错误：

您已在此页面上多次包含Google Maps API。
这可能会导致意想不到的错误。

即使先前删除了脚本，并且地图和内容也更改为其他内容，我得到这个错误。

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

或者它真的有一些对旧地图的引用，删除这两个脚本还不够。

感谢您的任何信息！

解决方案

删除脚本元素不会删除由这些脚本创建的对象基本上它没有任何作用）。

检查map-API是否已经被加载：

 <脚本> 
 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> 
  

I'm building a fully dynamic website using jquery/javascript, ajax and php.

When I click on a navigation link, the browser opens that page using ajax.

So basically all pages are loaded within the same index.php.

If I go to 'Location' tab, where I have a google map, it will load the Google Maps script dynamically (adding a script tag to the body).

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

This script is loaded automatically by the previous script

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

When I leave the 'Location' page, I check if the scripts are present and remove them.

If I go back to 'Location' without refreshing the page, I thought the map would have a clean start, but I get this error in console:

You have included the Google Maps API multiple times on this page. This may cause unexpected errors.

Even though the scripts were previously removed, and the map and content changed to something else, I get that error.

Since I know I have only once instance of the map, should I just ignore it?

Or it really has some kind of reference to the old map, and removing the two scripts is just not enough.

Thank you for any information!

解决方案

Removing script-elements will not remove objects that have been created by these scripts( basically it will not have any effect).

Check if the maps-API already has been loaded:

<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>

这篇关于通过AJAX载入Google地图API，控制台错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！