未捕获的类型错误：window.initMap 不是函数
Posted
技术标签:
【中文标题】未捕获的类型错误：window.initMap 不是函数【英文标题】：Uncaught TypeError: window.initMap is not a function 【发布时间】：2016-02-11 01:28:06 【问题描述】：编辑：通过移动
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBjEILUPsJO83wPyTKZlscBCMO-Aajy6Kw&signed_in=true&libraries=geometry, places&callback=initMap"></script>
在 js 脚本调用之后。然后通过尝试修复我之前的代码来修复我添加的错误。感谢您的帮助！
我一直在努力重新组织我的代码，以便项目更加健壮（与所有 javascript 嵌入到 html 文件中的方式相比），但是当将其移动到新的 javascript 文件并调用我收到的脚本时错误“未捕获的 TypeError：window.initMap 不是函数”。
如果有任何提示您可以向我提供/修复此错误，我们将不胜感激！
HTML 代码：
<!DOCTYPE html>
% load staticfiles %
<html>
<head>
<title>% block title % RacksOnRacks% endblock %</title>
<link rel="stylesheet" href="% static "css/racks.css" %" />
<script src="//code.jquery.com/jquery-1.11.2.min.js"></script> <!-- not sure what this is-->
% block script_block %% endblock %
</head>
<body>
<div id="menu">
<div id="logo" onclick="location.href='/';" style="cursor:pointer;">
<img id="logoimg" src="% static "images/temprackicon.png" %"/>
# TODO make this match onclick initmap#
</div>
<div id="title" onclick="location.href='/';" style="cursor:pointer;">
RACKS ON RACKS
</div>
</div>
% block body_block %% endblock %
</body>
</html>
其他 HTML 文件
% extends 'racks/baselayer.html' %
% load staticfiles %
% block title % Racks On Racks: Find Nearby Places to Secure Your Bike! % endblock %
% block script_block %
<link rel="stylesheet" href="% static "map/css/maps-admin.css" %" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBjEILUPsJO83wPyTKZlscBCMO-Aajy6Kw&signed_in=true&libraries=geometry, places&callback=initMap"></script>
<script type="text/javascript" src="% static "map/javascript/googlemaps.js" %"></script>
% endblock %
% block body_block %
<select id="filters">
<option value="100">100m</option>
<option value="250">250m</option>
<option value="500">500m</option>
<option value="1000">1000m</option>
</select>
<div id="map_canvas"></div>
% endblock %
和 JS：
function initMap()
var myLatLngGlobal;
var map;
var filterDistance;
var self =
// starts all the processes
//function placeRackMarkers(locations, map)
initialize: function ()
if (navigator.geolocation)
navigator.geolocation.getCurrentPosition(function (position)
var myLatLng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
myLatLngGlobal = myLatLng;
, function ()
handleLocationError(true, infoWindow, map.getCenter());
);
else
// Browser doesn't support Geolocation
handleLocationError(false, infoWindow, map.getCenter());
var zoom = 12;
//var filterDistance = 1000;
//var latlng = new google.maps.LatLng(lat, lng);
//myLatLngGlobal = latlng;
var options =
zoom: zoom,
center: myLatLngGlobal,
//mapTypeId:
;
map = new google.maps.Map(document.getElementById("map_canvas"), options);
var marker = new google.maps.Marker(
position: myLatLngGlobal,
map: map,
title: 'Hello World!',
draggable: false,
animation: google.maps.Animation.DROP
);
self.attachHandlers();
self.displayRacks();
//add all the intialiazing functions (self.(....)
,
//Event handlers attached
attachHandlers: function ()
$("#filterDistance").click(function ()
filterDistance = "#filterDistance";
);
//console.log("filterDistance = " + self.filterDistance);
,
/*
var filterDistance1 = document.getElementById("filters").value; //put outside of self var if this doesnt work
console.log("filterDistance =" + filterDistance1);
filterDistance = filterDistance1;
*/
displayRacks: function ()
var locations;
$.get('/racks/map_locations/', , function (data)
locations = data['racks'];
filterPlaceRacks(locations, myLatLngGlobal, map);
);
;
function placeRackMarkers(locations, map)
var marker, i;
for (i = 0; i < locations.length; i++)
marker = new google.maps.Marker(
position: new google.maps.LatLng(locations[i][1], locations[i][2]),
map: map
);
function filterPlaceRacks(racks, map)
var filteredRacks = [];
for (var i = 0; i < racks.length; i++)
if (checkDistance(racks[i]) <= self.filterDistance)
filteredRacks.push(racks[i]);
console.log(filteredRacks);
placeRackMarkers(filteredRacks, map);
function checkDistance(rack)
var rackLatLng = new google.maps.LatLng(rack[1], rack[2]);
return (google.maps.geometry.spherical.computeDistanceBetween(rackLatLng, myLatLngGlobal));
return self;
$(document).ready(function ()
var googleMap = initMap();
googleMap.initialize();
);
再次感谢！ PS。抱歉，代码结构不佳，仍在进行中。
同样使用 django 框架，以及带有 jquery 的 ajax
【问题讨论】：
可能重复（不同的错误但相同的解决方案）：***.com/questions/32691295/… 【参考方案1】：由于我的面包和黄油服务器端是 php，因此我在某个地方迷路了，但是如果这曾经可以工作，那么您可能弄乱了脚本应该加载的顺序（正在调用一个函数尚未加载）
尝试按照之前调用的顺序调用js的各个部分
您的 注释，这是一个用于 javascript (jQuery) 的库，您可能需要在页面上的所有其他脚本之前加载它。
P/S 很抱歉没有提供太多帮助，但我现在没有时间设置 django 来测试一下。
【讨论】：
以上是关于未捕获的类型错误：window.initMap 不是函数的主要内容，如果未能解决你的问题，请参考以下文章