javascript - Google map API 加载问题

Question

我通过 AJAX 调用异步加载 Google Maps API，屏幕上没有出现错误，Google API 代码输出正确，并且我有有效的纬度/经度坐标。我正在使用以下代码，任何人都可以对正在发生的事情提出任何想法吗？

<script type="text/javascript">
function initialize() {
    var mapOptions = {
        center: new google.maps.LatLng({lat}, {lng}),
        zoom: 16,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
}           
function loadScript()
{
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "http://maps.googleapis.com/maps/api/js?key={api_key}&sensor=false&callback=initialize";
    document.body.appendChild(script);
}
window.onload = loadScript;
</script>
<div id="map-canvas" class="map-canvas"></div>

Answer 1

上面的整个代码片段是通过 ajax 调用加载的

当您通过ajax加载片段时，当响应到达时，通常窗口已经被加载，在这种情况下，onload事件已经被触发(并且不会再次触发) , loadScript 永远不会被执行)

正如 geocodezip 所评论的，您的解决方案有效，因为 loadScript 将立即执行，但是当您想确保窗口已加载时，请检查readyState-文档的属性:

if(document.readyState==='complete'){
  loadScript();
}else{
  window.onload = loadScript;
}