Unable to load Google map from a page into a div in another page using ajax
Question
I am trying to load one html page into another html page using this javascript
$('.myajax').click(function() {
var myhref=$(this).attr('href');
$('#contentdiv').hide().load(myhref).fadeIn('slow');
return false;
});
The problem arises whenever I try to load a Google Map into that div, named contentdiv . Whenever I try to do so, nothing appears on the browser; it goes complete blank. The page containing the Google map goes as follows :
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps Geocoding Demo</title>
<script src="http://maps.google.com/maps/api/js?sensor=false"
type="text/javascript"></script>
</head>
<body>
<div id="map" style="width: 400px; height: 300px;"></div>
<script type="text/javascript">
var address = 'London,UK';
var map = new google.maps.Map(document.getElementById('map'), {
mapTypeId: google.maps.MapTypeId.ROADMAP,
zoom: 6
});
var geocoder = new google.maps.Geocoder();
geocoder.geocode({
'address': address
},
function(results, status) {
if(status == google.maps.GeocoderStatus.OK) {
new google.maps.Marker({
position: results[0].geometry.location,
map: map
});
map.setCenter(results[0].geometry.location);
}
else {
// Google couldn't geocode this request. Handle appropriately.
}
});
</script>
</body>
</html>
Can someone point out the error ??
1 answers
solution1
2 ACCPTED 2012-11-26 13:38:57
When you use $.load() it loads all the data outputed, so you are loading nothing in your <head> , you are not loading the google maps api, nor the javascript, at least not in a way it could be processed I think, never tried that but it's definetively not the use $.load() was intended for.
You would have to use iframes or try to actually include the google maps library and run the javascript code in the actual page when it comes to that page including google maps.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.