在网页中调用谷歌地图功能不起作用



我在网页的<head>中有以下功能:

<script type="text/javascript"> 
$(document).ready(function(){
function googmap(){
var marker;
var circle;
var map;
var bounds = new google.maps.LatLngBounds();
var latit = 5;
var longi = 6;
var search_range =  2;
map = new google.maps.Map(document.getElementById('map'), {
centre: new google.maps.LatLng(latit, longi),
mapTypeId: google.maps.MapTypeId.ROADMAP,
zoom: 6
});
marker = new google.maps.Marker({
position: new google.maps.LatLng(latit, longi),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(latit);
infowindow.open(map, marker);
}
})(marker, i));
}
});
</script>

我使用调用此函数

<body onLoad="googmap()">

然而,在javascript控制台中,它告诉我函数googmap()没有定义。我确信这个问题与作用域等有关,或者我定义函数的方式是错误的,但我对JavaScript非常陌生,所以我自己无法解决它——如果有任何帮助,我们将不胜感激!

您不需要在此处调用"onLoad='googmap()'",因为您已经在jquery document.ready.中执行了该函数

您只需在以下位置更改脚本:(省略规则"function googmap(){"和匹配的闭包"}")

$(document).ready(function(){
var marker;
var circle;
var map;
var bounds = new google.maps.LatLngBounds();
var latit = 5;
var longi = 6;
var search_range =  2;
map = new google.maps.Map(document.getElementById('map'), {
centre: new google.maps.LatLng(latit, longi),
mapTypeId: google.maps.MapTypeId.ROADMAP,
zoom: 6
});
marker = new google.maps.Marker({
position: new google.maps.LatLng(latit, longi),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(latit);
infowindow.open(map, marker);
}
})(marker, i));
});
</script>

您说得对,由于作用域的原因,没有定义googmap。由于函数是在匿名函数中创建的:

$(document).ready(function(){

它不存在于它之外。添加googlemap();到匿名函数的末尾。

最新更新