Ajax Wordpress 和谷歌地图答案

【问题标题】：Ajax Wordpress and Google MapsAjax Wordpress 和谷歌地图
【发布时间】：2015-08-04 15:21:45
【问题描述】：

我正在为我的 Wordpress 网站使用 ajax 插件（Ajaxify Wordpress 网站），我已经设法让 Google 地图正常工作，但我收到错误消息“您已在此页面上多次包含 Google Maps API ”。

我已将 Google Maps 脚本排入我的函数文件中，并在我的 js 文件中包含以下代码：

var map;
function initialize() {
    var mapOptions = {
        zoom: 8,
        center: new google.maps.LatLng(-34.397, 150.644)
    };
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
} 
google.maps.event.addDomListener(window, 'load', initialize);

为了让 Ajax 插件重新加载 Google Maps 脚本，我将此代码添加到插件 js 中，这就是我认为问题所在：

scriptNode = document.createElement('script');
contentNode.appendChild(scriptNode);
scriptNode.setAttribute('src', 'https://maps.googleapis.com/maps/api/js?key=xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' +
    '&signed_in=true&callback=initialize');
scriptNode = document.createElement('script');

有什么想法吗？

【问题讨论】：

我希望您不只是在其中发布自己的 google api 密钥...
这不行吗：if(!google){scriptNode = document.createElement('script'); //...}?¿
你可以试试getJSON() jQuery函数，类似于这个问题：load google maps api via ajax
或者这个：$.getScript(MyGMap.GMapScriptURL + CurrentKey + "&callback=MyGMap.InitializeMaps");，问题已回答here
哈哈。很好地抓住了沃尔夫。 @benmandv，最好获取一个新的 API 密钥，因为它仍在编辑历史记录中

标签： javascript jquery ajax wordpress

【解决方案1】：

最后，我选择了 How to check if Google Maps API is loaded? 的变体：

function appendBootstrap() {
if (typeof google === 'object' && typeof google.maps === 'object') {
    handleApiReady();
} else {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=handleApiReady";
    document.body.appendChild(script);
}
}

function handleApiReady() {
var myLatlng = new google.maps.LatLng(39.51728, 34.765211);
var myOptions = {
  zoom: 6,
  center: myLatlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
 }

【讨论】：