使用 HTML5 History API 使用 AJAX 重新加载页面时多次包含 Google Maps API答案

【问题标题】：Google Maps API included multiple times when reloading the page with AJAX using HTML5 History API使用 HTML5 History API 使用 AJAX 重新加载页面时多次包含 Google Maps API
【发布时间】：2012-12-28 12:35:11
【问题描述】：

我有一个使用 HTML5 历史 API 导航和重新加载页面信息的网站。这会发送一个检索相关页面信息的 AJAX 调用。在我的“联系人”页面上，我有 google maps api 脚本。如果通过访问 URL 加载页面，它工作正常。 Google 会加载地图 API 并将其包含在我的结束正文标记之前。

如果我离开页面（使用历史 API 删除和添加内容）然后返回到联系人页面（再次通过历史 API），则会对（已包含的）地图 API 进行第二次调用，它加倍。这会导致控制台中出现警告消息。

我已尝试在加载新内容之前删除在结束正文标记之前添加的 Google 地图脚本，但由于脚本已被解析，地图的所有相关功能仍保留在浏览器内存中。

所以我想我的问题是，'当我对页面内容发出 AJAX 请求时，有什么方法可以卸载所有的谷歌地图 JS？'。

控制台消息如下：

警告：您已在此页面上多次包含 Google Maps API。这可能会导致意外错误。

【问题讨论】：

向我们展示您的脚本。您很可能包含多个 .js 文件，并且地图被多次加载。检查这个：stackoverflow.com/questions/9719157/…
不幸的是，我希望它像这样简单。我可以确切地看到问题是什么以及为什么会发生。如果它是重复的包含，那么当我通过 URL 加载页面时它会出错。但这与通过历史 API 重新加载的页面有关，这导致重复包含，因为地图已经包含在第一次加载时。因此，如果我导航到联系人 5 次，我将看到在结束正文标记之前添加了 5 个地图。
你必须包含你的脚本。否则我怀疑有人可以进一步帮助你
我也遇到了这个问题。如果您找到了解决方案，请告诉我？
我猜这是probably the correct answer。不要破坏地图...

标签： jquery html google-maps html5-history

【解决方案1】：

我也收到此错误，我有一个使用谷歌地图的页面，如果我使用 ajax 重新加载带有谷歌地图代码的页面部分，则会出现错误。

请注意，我的 HTML 没有重复，但一个 html 块被具有 google maps HTML 的相同数据覆盖，并且它被视为两个块而不是一个看起来。我什至在插入 html 块之前尝试使用 jquery .empty() 但没有变化，仍然是多个错误。该页面在加载时不会抛出错误，所以我唯一的结论是。

编辑：当我想到它时，我认为原因是我的 HTML 块包含一个脚本包含行，即使这只是 HTML 中的一次，这一行的重点是将一堆代码加载到 DOM 中，所以简单地说.. . 解决方案只加载脚本一次 - 正如谷歌所说！ doh! 只需要考虑一下那些

【讨论】：

没错，我链接到this thread，有人解释说不销毁实例。