我们有一个在jQuery 1.4.2上运行的应用程序,我们正在慢慢升级到jQuery 1.9.1
我们正在升级的其中一个页面上有一个Google Map。从广义上讲,该页面包含......
<head>
<script src="/javascripts/jquery-1.4.2.min.js?1362527887" type="text/javascript"></script>
...
<script src="/javascripts/google_map.js?1362527225" type="text/javascript"></script>
</head>
<body>
...
<script type="text/javascript">
$(document).ready(function () {
new GoogleMap($('#map_canvas'), '<%= APP_CONFIG['google_maps_api_key'] %>');
});
</script>
</body>
这会加载jQuery,然后加载javascript文件,该文件初始化我们的Google地图,如下所示:
GoogleMap = function (mapElement, apiKey) {
this.initialized = false;
this.mapElement = mapElement;
$.getJSON('http://maps.googleapis.com/maps/api/js?key=' + apiKey + '&sensor=false&callback=?', $.proxy(this.apiLoaded, this));
};
GoogleMap.prototype = {
apiLoaded:function () {
this.show();
var mapOptions = this.defaultLocation();
this.map = new google.maps.Map(this.mapElement[0], mapOptions);
...
},
....
};
在jQuery 1.4.2上,这一切都有效。但是,当我们转到jQuery 1.9.1(或1.6.3和1.9.1之间的任何jQuery版本,它的价值)时,我在Javascript控制台中看到以下错误:
Uncaught TypeError: Property 'jQuery191006026467704214156_1362528404472' of object [object Window] is not a function
此错误发生在main.js中,这是一个通过上述调用加载谷歌地图时关闭的文件。将jQuery版本从1.4.2更改为1.4.3可以正常工作 - 所以它不仅仅是“任何改变”而是打破了它。
重新创建错误的JSBin(虽然没有显示地图,即使1.4.2已经到位,可能是因为我剪得太多了?)在这里:http://jsbin.com/okirac/4/
对于更高版本的jQuery,我是否需要以不同的方式调用google地图?或者我应该以不同的方式使用jQuery来避免与谷歌地图的冲突?
就像我说的那样,这些地图在jQuery 1.4.2以及页面上的一大堆其他javascript调用中运行良好。但是更高版本的jQuery在页面上打破谷歌地图,而所有其他的javascript调用似乎都没问题。
答案 0 :(得分:0)
感谢@Capitaine和@ i--的评论,我得到了它的工作。
似乎1.4.x之后的jQuery,你不能再依赖jQuery.getJSON()来对抗Google Maps,后者实际上返回JS而不是JSON(请参阅原始问题评论中的链接)。
最后,我使用Google Maps documentation将我的页内javascript代码更改为:
<script type="text/javascript">
$(document).ready(function () {
gmap = new GoogleMap($('#map_canvas'));
var script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://maps.googleapis.com/maps/api/js?key=<%= APP_CONFIG['google_maps_api_key'] %>&sensor=false&callback=gmap.apiLoaded";
document.body.appendChild(script);
});
</script>
这会设置一个全局“gmap”对象,然后在Google Maps API上定义一个回调参数,这意味着在加载Maps API后,它会调用我的gmap对象上的apiLoaded()函数。
这适用于旧版本和新版本的jQuery。