Php Googlemaps V3和Ajax加载（）菜单_Php_Jquery_Ajax_Google Maps

Php Googlemaps V3和Ajax加载（）菜单

php jquery ajax google-maps

Php Googlemaps V3和Ajax加载（）菜单,php,jquery,ajax,google-maps,Php,Jquery,Ajax,Google Maps,我已经做了一段时间了，但是我仍然没有回应我想做的是加载一个带有ajax无刷新菜单的Google地图。这是加载所有菜单页面的主页，我将调用main.php： <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://m

我已经做了一段时间了，但是我仍然没有回应

我想做的是加载一个带有ajax无刷新菜单的Google地图。这是加载所有菜单页面的主页，我将调用main.php：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=API_KEY&sensor=false">
</script>

<ul id="nav">
    <li><a href="page_main">Main</a></li>
    <li><a href="page_weather">Weather</a></li>
    </ul>


    <div id="content"></div>


    <script>
    $(document).ready(function(){
        //initial
        $('#content').load('menu/page_main.php');

        //handle menu clicks
        $('ul#nav li a').click(function() {
            var page = $(this).attr('href');
            $('#content').load('menu/' + page + '.php');
            return false;

        });

    });

    </script>

这是带有地图的页面，让我们调用page_weather.php：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=API_KEY&sensor=false">
</script>

<script type="text/javascript">
      function initialize() {
        var mapOptions = {
          center: new google.maps.LatLng(-15.869167, -47.920834),
          zoom: 3,
          disableDefaultUI: true,
          mapTypeId: google.maps.MapTypeId.HYBRID
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"),mapOptions);
        }



      google.maps.event.addDomListener(window, 'load', initialize);
</script>

<h1>Principal</h1>

</br>
</br>

<body onLoad="initialize()">

<div id="map_canvas" style="width:800; height:400;"></div>

当直接在浏览器中加载page_weather.php时，地图会正确加载，但当使用ajax无刷新菜单加载页面时，我只会得到一个800x400的白色框

我怎样才能解决这个问题

已经尝试过：

实际上，jQuery将通过jQuery.load为您执行标记。您的问题在于您正在使用window.load事件初始化google地图。如果在初始窗口加载后将此脚本注入文档，则永远不会触发此事件

如果GoogleMaps不像大多数库那样坚持使用window.load事件而不是dom就绪事件，我会有更好的解决方法。但由于初始化函数是一个全局函数，您只需将加载调用更改为：

$('#content').load('menu/page_main.php', function () {
    initialize();
});

顺便说一下，删除onLoad=initialize。google.maps.event.AddDomainListenerWindow'load'，initialize正在设置window.load事件；行。

事件是在函数之前生成的，它无法识别，请输入以下代码：

$(window).load(function(){
google.maps.event.addDomListener(window, 'load', initialize); 

});