2

我正在使用以下代码在 IE9 中异步加载 Google Maps API 脚本：

function initialize() {
  ...
}

function loadScript() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src = "http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=TRUE_OR_FALSE&callback=initialize";
  document.body.appendChild(script);
}

window.onload = loadScript;

现在的问题是，当脚本完全加载时，initialize()会自动调用该函数。但是有时当用户配额超出时，该initialize()函数不会被调用，我们看到的不是 map，而是纯白屏幕。

我想检测到这一点并触发我的自定义函数，该函数会显示一些警报，例如："Error!"。

谁能告诉我如何做到这一点？

提前致谢...

4

2 回答 2

1

正如安德鲁所说，没有直接的方法来处理这个问题。但是，您至少可以考虑这种可能性。

在合理的时间范围内设置超时（5 秒？）。在超时回调函数中，测试 google 和/或 google.maps 是否存在。如果它不存在，则假定脚本加载失败。

setTimeout(function() {
  if(!window.google || !window.google.maps) {
    //handle script not loaded
  }
}), 5000);
// Maps api asynchronous load code here.
于 2013-02-04T14:48:36.227 回答
0

我终于找到了解决这个问题的方法。Chad 提供了一个很好的解决方案，但唯一的问题是您不能将那段代码放入callback()函数中，因为如果脚本加载失败，callback()则永远不会调用该函数！

因此，根据乍得提到的内容，我终于想出了以下解决方案：

function initialize() {
  ...
}

function loadScript() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src = "http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=TRUE_OR_FALSE&callback=initialize";
  setTimeout(function () {
        try{
            if (!google || !google.maps) {
                //This will Throw the error if 'google' is not defined
            }
        }
        catch (e) {
            //You can write the code for error handling here
            //Something like alert('Ah...Error Occurred!');
        }
    }, 5000);
  document.body.appendChild(script);
}

window.onload = loadScript;

这对我来说似乎很好用！:)

于 2013-02-04T17:18:39.413 回答