1

さて、私はしばらくこれに取り組んできましたが、まだ応答がありません..

私がやろうとしているのは、リフレッシュメニューのないajaxでgooglemapをロードすることです。これがすべてのメニュー ページをロードするメイン ページです。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 の白いボックスしか表示されません。

どうすればこれを修正できますか?

すでに試しました：

AJAXによって取得された <div> 内で <script> を実行する

innerHTML でスクリプトを挿入できますか?

4

2 に答える 2

0

実際、jQuery は<script>を介し​​てタグを実行しますjQuery.load()。問題は、window.loadイベントを使用して Google マップを初期化しているという事実にあります。最初のウィンドウの読み込み後にこのスクリプトをドキュメントに挿入すると、このイベントはトリガーされません。

window.loadほとんどのライブラリのように dom Ready イベントではなく、Google マップがイベントを主張しない場合は、より良い回避策があります。ただし、initialize()関数はグローバル関数であるため、load呼び出しを次のように変更するだけで済みます。

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

ちなみに、取り外しますonLoad="initialize()"。すでに行window.loadによって設定されているイベントがありgoogle.maps.event.addDomListener(window, 'load', initialize);ます。

于 2013-07-27T19:08:49.500 に答える