0

誰かが私のコードを見て、私が間違っていることを教えてください。私は今、さまざまなことを試すのに多くの時間を費やしてきましたが、成功していません. 私を助けてくれるすべての人に戦車を！

  • このページを直接呼び出すと機能します
  • リンクタイプ「外部」で前のページからこのページを呼び出すと機能します
  • 1 つの jQueryMobile ページからこのページに通常どおりこちら側を呼び出すと、機能せず、マップが空になります。[リロード] をクリックすると、すべてが完璧です

コード：

<html> 
<head>
    <meta charset="UTF-8">  
          <meta name="viewport" content="minimum-scale=1.0, width=device-width, maximum-scale=1.0, user-scalable=no"  />
    <meta name="apple-mobile-web-app-capable" content="yes">
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
        <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
        <script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> 
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&libraries=places"></script> 
</head>
<body>
<div data-role="page" id="basic_map">
        <script type="text/javascript">
        $("div:jqmData(role='page'):last").bind('pageinit', function() {
            if(navigator.geolocation) {
                        navigator.geolocation.getCurrentPosition(function(position){
                            initialize(position.coords.latitude,position.coords.longitude);
                        });
                }
            });

            function initialize(lat,lng) {

            var latlng = new google.maps.LatLng(lat, lng);

            var myOptions = {

                zoom: 12,
                        center: latlng,
                        mapTypeId: google.maps.MapTypeId.ROADMAP
                };

            var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);

 </script>

    <div data-role="header" data-theme="b" data-position="fixed" data-inset="false">
            <h1>My</h1>
        <a href="index.html" data-icon="home" class="ui-btn-right" data-iconpos="notext" >Home</a>
        </div>  

    <div data-role="content">

            <h4>Map</h4>

        <div class="ui-bar-c ui-corner-all " >
            <div id="map_canvas" style="height:300px;"></div>
        </div>
    </div>
    </div>  
</body>
</html>
4

2 に答える 2

0

--編集-- 私が言ったことを忘れてください。あなたはそれが問題を解決しないのは正しいです。:)

34 行目の initialize() 関数を閉じるのを忘れたようです! ところで、doctype を配置することを忘れないでください。そうすると、35 行目になります。

自分のマシン (Chrome 19) ですぐに地図が表示されるようになりました

于 2012-06-07T11:47:10.670 に答える
0

この質問は、この質問に対する回答とまったく同じであることがわかりました。私はあなたと同じコードを使用しているため、なぜあなたの側で機能しないのかわかりません。

マップが中心からずれている不具合に遭遇しましたが、 に置き換えることで修正されましpageinitたpageshow。私にとっては、ページをリロードしたり、ブラウザのウィンドウ幅を変更したりすることでも修正されました。

あなたのマップは完全に見えませんか、それとも左上隅に何かが見えますか?

于 2012-06-08T11:29:24.640 に答える