Google Maps addListener и Jquery странное поведение - PullRequest
0 голосов
/ 01 января 2011

Это странно, возможно, кто-то может объяснить мне, почему это происходит.

Если я использую закомментированный for вместо .each(), тогда каждый маркер отображает информацию последнего storeObj при нажатии.Однако кажется, что при использовании .each () это хорошо.Все маркеры - это места, где они должны находиться, это просто прослушиватель щелчков.

PS: Если вы хотите получить полный исходный код, просто посетите этот URL: http://tinyurl.com/38x6yfe

        //for(index=0; index < store_array.length; index++) {
        $(store_array).each(function(index, this_store){
            //name  address address2    csz state   phone lng   lat   accuracy  brands
            //  0      1       2         3    4      5     6      7     8         9

            /*

            use this for FOR statement
            var name = store_array[index][0]
            name = name.replace(/\&/g,'&amp;');
            var address = store_array[index][1];
            var address2 = store_array[index][2];
            var csz = store_array[index][3];
            var state = store_array[index][4];
            var phone = store_array[index][5];
            var lng = store_array[index][6];
            var lat = store_array[index][7];
            //var accuracy = store_array[index][8];
            var brands = store_array[index][9];
            */

            var name = this_store[0]
            name = name.replace(/\&/g,'&amp;');
            var address = this_store[1];
            var address2 = this_store[2];
            var csz = this_store[3];
            var state = this_store[4];
            var phone = this_store[5];
            var lng = this_store[6];
            var lat = this_store[7];
            //var accuracy = this_store[8];
            var brands = this_store[9];



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

            var storeObj = new google.maps.Marker({
                position: latlng,
                icon: gicons[brands],
                shadow: iconShadow,
                map: G_MAP,
                visible: false,
                title: name,
                zIndex: Math.round(lat * -100000) << 5
            });

            storeObj.id = index;
            storeObj.name = name;
            storeObj.state = state;
            storeObj.brands = brands;

            //add this store into the stores array
            G_STORES_ARRAY.push(storeObj);


            console.log('index =' + index + ' name = ' + name + ' storeObj = ');
            console.log(storeObj);


            //create a listener for each store
            google.maps.event.addListener(storeObj, 'click', function () {
                //G_MAP.setCenter(latlng); 


                console.log('index =' + index + ' name = ' + name + ' storeObj = ');
                console.log(storeObj);

                var contentString = "<b>" + name + "<\/b><p>" + address + "<p>" + csz+ "<p>" + phone;

                var urlstring = encodeURIComponent(name+' '+address+' '+csz);
                contentString += '<br><a href="http://maps.google.com/?q='+urlstring+'" target="_blank">Directions</a>';
                contentString += ' - <a  href="javascript:G_MAP.setCenter(new google.maps.LatLng('+latlng.toUrlValue(6)+')); G_MAP.setZoom(13);">Zoom To</a>';
                contentString += ' - <a  href="javascript:G_MAP.setCenter(new google.maps.LatLng('+latlng.toUrlValue(6)+')); G_MAP.setZoom(parseInt(G_MAP.getZoom())+1);">[+]</a>';
                contentString += ' - <a  href="javascript:G_MAP.setCenter(new google.maps.LatLng('+latlng.toUrlValue(6)+')); G_MAP.setZoom(parseInt(G_MAP.getZoom())-1);">[-]</a>';


                G_INFOWINDOW.setContent(contentString);
                G_INFOWINDOW.open(G_MAP, storeObj);
            });

            google.maps.event.addListener(storeObj, 'mouseover', function () {
                storeObj.setIcon(gicons["none"]);
            });

            google.maps.event.addListener(storeObj, 'mouseout', function () {
                storeObj.setIcon(gicons[storeObj.brands]);
            });
        });
    });

1 Ответ

0 голосов
/ 03 января 2011

Чтобы понять, почему это происходит, вам нужно прочитать о замыканиях в javascript.Вот специфичный для API Карт Google пример , более официальное описание и объяснение того, как они реализованы в функции jequery .each ()

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...