0

Phonegap アプリにこの JQM があります。Google マップを作成し、json ファイルからマーカーを読み込みます。

page2 を起動すると、最初の console.log (座標) と最後の - numberOfElementsconsole.log (2222222)を含む中間の console.log が最初にのみ表示されます。マップが表示されて戻ってきた場合、スクリプト全体が読み込まれていません。

なんで？

$(document).on('pageshow', '#page2', function () {
    var latnow = Number(localStorage.getItem("lat"));
    var lngnow = Number(localStorage.getItem("lng"));
    var coordinate = new google.maps.LatLng(latnow, lngnow);
    console.log(latnow + ' ' + lngnow);
    $('#map_canvas').gmap({
        'center': coordinate,
            'disableDefaultUI': true,
            'zoom': 5,
            'scrollwheel': false,
            'panControl': false
    });
    $('#map_canvas').gmap().bind('init', function () {
        var images = "img/icon.png";
        var images2 = "img/icon2.png";

        $.getJSON('http://www.site.com/app/json.php?lat=' + latnow + '&lat=' + lngnow + '', function (data) {
            var myObject = data;
            var numberOfElements = data.markers.length;
            console.log(numberOfElements); // <- !!!!!!
            if (numberOfElements == 0) {
                alert("no result");
                $.mobile.changePage("#home");
            }
            var myObject = JSON.stringify(myObject);
            localStorage.setItem("json_near", myObject);
            $('#map_canvas').gmap('addMarker', {
                'position': coordinate,
                    'icon': images2,
                    'bounds': true
            });

            //marker da json
            $.each(data.markers, function (i, marker) {

                $('#map_canvas').gmap('addMarker', {
                    'position': new google.maps.LatLng(marker.latitude, marker.longitude),
                        'draggable': false,
                        'bounds': true,
                        'icon': images

                }).click(function () {
                    $('#map_canvas').gmap('openInfoWindow', {
                        'content': marker.content,
                            'maxWidt': 200,
                            'maxHeight': 400,
                            'autoScroll': true
                    }, this);
                });
            });
        });
    });

    map_element = document.getElementById("map_canvas");

    var mapwidth = $(window).width();
    var mapheight = $(window).height();
    $("#map_canvas").height(mapheight);
    $("#map_canvas").width(mapwidth);

    google.maps.event.trigger(map_element, 'resize');

    console.log("2222222");

});
4

1 に答える 1

0

このプラグインを使用していると思います - http://code.google.com/p/jquery-ui-map/ですね。

jquery mobileの問題ではないと思います。これらの console.log メッセージからわかるように、pageshow イベントが呼び出されます。console.log("xxx")gmap init ハンドラに固執するようにしてください。これは、2回目に呼び出されないものだと思います。

何かのようなもの

$('#map_canvas').gmap().bind('init', function () {
        console.log("xxxxxx");
        var images = "img/icon.png";
        var images2 = "img/icon2.png";
...
...
});

ページにアクセスするたびに、コンソールに xxxxxxx が表示されますか? そうでない場合は、マップが既に初期化されているかどうかを確認する方法を見つけて (2 回目、3 回目、4 回目など)、getJSON を直接呼び出します。

于 2013-07-22T16:10:19.753 に答える