简体   繁体   English

无法使用ajax将Google地图从页面加载到另一个页面中的div

[英]Unable to load Google map from a page into a div in another page using ajax

I am trying to load one html page into another html page using this javascript 我正在尝试使用此JavaScript将一个html页面加载到另一个html页面


$('.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 . 每当我尝试将Google Map加载到名为contentdiv div中时,就会出现问题。 Whenever I try to do so, nothing appears on the browser; 每当我尝试这样做时,浏览器上都不会显示任何内容; it goes complete blank. 它完全空白。 The page containing the Google map goes as follows : 包含Google地图的页面如下:


<!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 ?? 有人可以指出错误??


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. 当你使用$.load()它会加载所有输出的数据,因此你在<head>中没有加载任何内容,你没有加载谷歌地图api,也没有加载javascript,至少不是以它可以处理的方式加载我想想,从来没有尝试过,但它的定义并不是$ .load()的用途。

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. 你必须使用iframe或尝试实际包含谷歌地图库,并在实际页面中运行javascript代码,包括谷歌地图。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM