IE8中的Google Maps API加载失败("'google'未定义")

Tro*_*ott 7 javascript google-maps google-api internet-explorer-8 google-maps-api-3

当我在脚本代码中加载http://maps.google.com/maps/api/js?sensor=false时,Chrome,Safari,Firefox和IE9中的所有功能都可以正常使用.

但是,当我在兼容模式下查看IE9 (或者,我被告知,在IE8中)地图未加载并且"'google'未定义"在控制台中记录.

这是相关代码,其中的行触发了通过注释标识的错误:

<html>
<head>
<title>Test Map</title>
<script type="application/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
</head>
<body>
<div id="map_canvas"></div>
<script type="text/javascript"> 
var lat=37.763154;
var lon=-122.457941;
var initialZoom=17;
var mapTypeId = 'Custom Map';
var mapStyle = [{featureType:"landscape", elementType:"all", stylers:[{hue:"#dae6c3"},{saturation:16},{lightness:-7}]}, 
                {featureType:"road", elementType:"geometry", stylers:[{hue:"#ffffff"},{saturation:-100},{lightness:100}]}];

//**The error is tripped in this next line, again only in IE9 compatibility mode or IE8*     
var styledMap = new google.maps.StyledMapType(mapStyle);

var mapType = new google.maps.ImageMapType({
    tileSize: new google.maps.Size(256,256),
    getTileUrl: function(coord,zoom) {
        return "img/tiles/"+zoom+"/"+coord.x+"/"+coord.y+".png";
    }
});
var map = new google.maps.Map(document.getElementById("map_canvas"), 
        {center:new google.maps.LatLng(lat,lon),
         mapTypeId:google.maps.MapTypeId.ROADMAP,
         zoom:initialZoom,
         mapTypeControl:false});
map.overlayMapTypes.insertAt(0, mapType);

map.mapTypes.set(mapTypeId, styledMap);
map.setMapTypeId(mapTypeId);
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

因此,出于某种原因,仅在IE9 +兼容模式和IE8中,指定http://maps.google.com/maps/api/js?sensor=false的脚本标记未在加载和/或执行之前后续嵌入式脚本在正文中.

其他人是否能够复制?我该如何解决这个问题?

Tro*_*ott 3

显然,问题在于 IE 8 不理解“application/javascript”。<script>我在该部分的标记中将其更改为“text/javascript” <head>,现在我的代码可以工作了。当然,如果我将其改回“application/javascript”,那么它就会停止工作。