在你回复之前:这并不像你想象的那么直接!
- 我有一个“在 map 上显示”按钮 单击时打开 对话框/灯箱与谷歌 映射。
- 我不想加载 map api 页面加载,就在 map 被加载时 要求
这是“在 map 上显示”按钮放入对话框的 php 文件:
<div id="map_canvas"></div>
<script type="text/javascript">
$(function() {
//google maps stuff
var latlng = new google.maps.LatLng(<?php echo $coords ?>);
var options = {
zoom: 14,
center: latlng,
mapTypeControl: false,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map_canvas'), options);
var marker = new google.maps.Marker({
position: new google.maps.LatLng(<?php echo $coords ?>),
map: map
});
})
</script>
我一直在尝试在像这样的对话框中使用 ajax 之前加载 API:
$('img.map').click(function(){
var rel = $(this).attr('rel');
$.getScript('http://maps.google.com/maps/api/js?sensor=false', function(){
$.fn.colorbox({
href:rel
})
});
})
这似乎不起作用:(
我也试过:
- 添加
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
到ajax文件 - type="text/javascript"运行
$.getScript('http://maps.google.com/maps/api/js?sensor=false');
准备就绪
问题 浏览器似乎被重定向到 api.js 文件 - 你看到一个白屏
最佳答案
This FAQ answer详细介绍了如何异步加载 Maps API,还有一个很好的 example随之而来。
基本上,建议您将执行代码放在命名函数中,然后加载 Maps API 引用所述回调并使用“async”参数。或者您可以这样使用 jQuery 的 getJSON:
$.getJSON('http://maps.google.com/maps/api/js?sensor=false&async=2&callback=?', function(){
$.colorbox({
href:rel
})
});
关于javascript - jquery:如何通过 ajax 加载 Google Maps API?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2811787/