0

我的 Phonegap 应用程序中有这个 JQM;我创建了一个谷歌地图并从 json 文件加载标记。

当我启动 page2 时,我看到第一个 console.log(坐标)和最后一个console.log (2222222)- 包含 numberOfElements 的中间 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 初始化处理程序。我认为这是第二次没有调用的那个。

就像是

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

每次进入页面时,您是否在控制台中看到 xxxxxxx?如果没有,请尝试寻找如何检查地图是否已经初始化(第二次,第三次,第四次等)的方法,然后直接调用getJSON。

于 2013-07-22T16:10:19.753 回答