javascript - 通过 JQuery Load 加载 Google Map？

Question

在执行流程中，initialize() 函数需要出现在代码中，以允许通过 JQuery .load()< 加载 Google Map v3 API map 调用。

我现在的代码是这样的

$('#maplink').click(function(){
    $('.fades').fadeOut('slow');
    $('#googleMap').show();
    $('#googleMap').load("map.html");
    initialize();
});`

但是，这并不是在 AJAX 调用之后初始化 map 。

任何帮助将不胜感激:)

Answer 1

这是一个非常古老的问题，但对于最终出现在这里的任何人来说，将 .html 页面加载到 div 中并不是动态加载 Maps API map 的正确方法。以下是应该如何完成:

首先，将您所有的 Maps API 脚本放入宿主页面 - 包含 #googleMap div 的页面。或者，如果您希望该脚本本身位于异步加载的文件中，请将其放入 .js 文件中并使用 $.getScript() 加载它。

然后，如果您想异步加载 Maps API 和 map 以响应您的按钮点击，请使用 this asynchronous Maps API example 中的代码.

在该示例页面中，您不会使用这一行:

window.onload = loadScript;

相反，您将从点击处理程序调用 loadScript() 函数:

$('#maplink').click(function(){
    $('.fades').fadeOut('slow');
    $('#googleMap').show();
    loadScript();
});

其中 loadScript() 是示例中的 Maps API 加载函数。

事实上，您可以使用 $.getScript() 加载 Maps API - 只需为其提供 loadScript() 示例函数中使用的 URL。除了硬编码 URL 之外，loadScript() 函数几乎等同于 $.getScript()。

当然，您还需要更改该示例中的 initialize() 函数以匹配您的页面。