Question

我目前正在使用JavaScript加载Google Maps API，如下所示：

// Private methods
  function loadApi() {
    var script = document.createElement('script');
    script.onerror = function(e) {
      exit('MarvMap: Unable to load Google Map API, please check the URL.');
    };
    script.onload = function () {
      if (this.options.debug) console.log('MarvMap (Debug): Google Map API loaded, using: ' + this.options.api.key);
    }.call(this);
    script.src = this.options.api.url;
    document.head.appendChild(script);
  }

这会在结束</head>标记之前加载脚本并对其进行广告。但是，它加载的脚本似乎加载了其他脚本，因此它不能立即使用。

在这里，您可以看到我先调用上述功能，然后尝试使用Google Maps API：

// Public methods
MarvMap.prototype.init = function() {
  loadApi.call(this);

  // Setup map options and map reference
  initMapOptions.call(this);

  // Build the map
  build.call(this);
};

但是我在下面标记的行上收到错误google is not defined：

function initMapOptions() {
    this.mapReference = new google.maps; // Error here
    this.map_options = {
      map_type: function(i) {
        if (this.mapReference.MapTypeId[(i-1)] !== undefined) {
          return this.mapReference.MapTypeId[(i-1)];
        } else { exit(this.errors.map_type(i)); }
      }.bind(this)
    };
  }

Answer 1

在等待一些文件（或多个文件）加载时延迟api使用我会使用类似的东西：

loadApi(this);
ensureApiIsLoaded();


function ensureApiIsLoaded(){
    if(typeof google == 'undefined'){
        setTimeout(ensureApiIsLoaded, 125);
        return;
    } else {
        callbackGoesHere(); //initMapOptions?
    }
};

关于你的while循环：

    while (typeof google != 'undefined') {
        setTimeout(function() { }, 1000);
    }
    google;

启动脚本加载 - ＆gt; api还没有准备好，显然
while条件将评估为＆＃39; false＆＃39; - ＆GT; while循环体被解雇
google仍未定义，因为在订购获取脚本文件和尝试使用之间没有任何时间实际加载lib - ＆GT;错误。

谷歌在动态添加时未定义

1 个答案: