use*_*162 5 javascript jquery google-maps
我正在尝试在只能通过外部 javascript 文件进行编辑的页面上使用 Google Maps API。问题是，当我尝试使用 getScript 动态加载 Google Maps API 时，它不会加载。
有没有办法动态加载Google Maps API？
这有效：
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script>
function codeAddress() {
new google.maps.Geocoder().geocode({'address':document.getElementById('address').value}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
alert('worked!');
}
});
}
</script>
<body>
<input id="address" type="textbox" value="Sydney, NSW">
<input type="button" value="Submit" onclick="codeAddress()">
</body>
但我需要仅使用 javascript 动态加载 api，如下所示：
<script>
$("document").ready(function () {
$.getScript("https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false");
});
function codeAddress() {
new google.maps.Geocoder().geocode({'address':document.getElementById('address').value}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
alert('worked!');
}
});
}
</script>
<body>
<input id="address" type="textbox" value="Sydney, NSW">
<input type="button" value="Submit" onclick="codeAddress()">
</body>
编辑：在这里找到解决方案 - https://gist.github.com/jorgepedret/2432506
根据Google 的说明，您必须添加&callback=initialize到您的网址：
$.getScript("https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&callback=initialize");
http://jsfiddle.net/mblase75/dErNs/
然而，为了完全安全，您应该使用.done()让您的函数等到.getScript()完成：
$(document).ready(function () {
window.gmap_async = $.getScript("https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&callback=initialize");
// global Deferred variable
});
function codeAddress() {
window.gmap_async.done(function () {
new google.maps.Geocoder().geocode({
'address': document.getElementById('address').value
}, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
alert('worked!');
}
});
});
}
http://jsfiddle.net/mblase75/dErNs/1/
| 归档时间： |
|
| 查看次数： |
4082 次 |
| 最近记录： |