Задание имени переменной на основе итерации цикла - PullRequest
1 голос
/ 02 декабря 2011

Надеюсь, я не пропускаю чрезвычайно простое решение, когда задаю этот вопрос.

У меня есть цикл в функции в Javascript, который получает координаты и имя местоположения из файла XML и создаетмаркеры на заказной карте Google.Я хочу, чтобы на эти маркеры можно было кликать и открывать информационное окно.У меня есть код, написанный для него, и все маркеры хорошо отображаются на карте.Но когда я нажимаю на любой маркер, только первое информационное окно появляется на первом созданном маркере.Вот что я сделал ...

for(var i=0; i<items.length; i++) {
        var latitude = items[i].getElementsByTagName('Lat')[0].childNodes[0].nodeValue;
        var longitude = items[i].getElementsByTagName('Lon')[0].childNodes[0].nodeValue;
        var latlng = new google.maps.LatLng(latitude,longitude);
        var titleNode = items[i].getElementsByTagName('Name')[0].childNodes[0];
        var marker = new google.maps.Marker({
                position: latlng,
                map: map,
                title: titleNode.nodeValue,
                icon: orangeCircle
        });

        var infoWindow = new google.maps.InfoWindow({
                content: 'Hello world'
        });

        google.maps.event.addListener(marker, 'click', function() {
                infoWindow.open(map, marker);
        });
}

Мое предположение (и это всего лишь предположение, я новичок в javascript) заключается в том, что мне нужно создать новое имя маркера для каждого маркера.Как в, каждый не должен просто быть назван "маркером".Я думал, что самый простой способ исправить это - создать имя переменной, основанное на том, какая итерация была в цикле, поэтому marker1, marker2, marker3 и т. Д. Но я не уверен, как мне задать имя переменной, чтобы добавить числодо конца, основываясь на какой бы итерации мы ни были.

Может быть, я ошибаюсь.Есть ли другой способ, которым я мог бы сделать это, если это неправильно?Спасибо !!

Ответы [ 2 ]

2 голосов
/ 02 декабря 2011

Вы можете поместить всю логику в функцию, передать ее i, и она будет просто работать.

for(var i=0; i<items.length; i++) {
    setUpMap( i );
}

Вот функция:

function setUpMap( i ) {
    var latitude = items[i].getElementsByTagName('Lat')[0].childNodes[0].nodeValue;
    var longitude = items[i].getElementsByTagName('Lon')[0].childNodes[0].nodeValue;
    var latlng = new google.maps.LatLng(latitude,longitude);
    var titleNode = items[i].getElementsByTagName('Name')[0].childNodes[0];
    var marker = new google.maps.Marker({
            position: latlng,
            map: map,
            title: titleNode.nodeValue,
            icon: orangeCircle
    });

    var infoWindow = new google.maps.InfoWindow({
            content: 'Hello world'
    });

    google.maps.event.addListener(marker, 'click', function() {
            infoWindow.open(map, marker);
    });
}
2 голосов
/ 02 декабря 2011

Вам нужно разорвать замыкание, которое имеет ваш обработчик событий, с картой и маркером.

google.maps.event.addListener(marker, 'click', (function(lmap, lmarker) { 
       return function() { infoWindow.open(lmap, lmarker); }
    })(map, marker)
);

В том виде, в котором вы его получили, обработчик событий не создавал функцию, которая передавала значения отображение и маркер на inforWindow.open, он передавал сами переменные;это создавало замыкание над этими переменными.Что бы эти переменные ни оказались в конце вашей функции, это то, что будут использовать все обработчики.

Вы нарушите замыкание, передав эти переменные в функцию.Параметры функции передаются по значению , что фактически создает моментальный снимок этих переменных и использует это значение.

Также обратите внимание, что объявление этих переменных внутри цикла не помогает, поскольку всепеременные имеют область видимости функции в JavaScript.Это означает, что даже если вы объявили эти переменные внутри цикла, объявления подняты в верхнюю часть функции.Это так же, как если бы вы фактически объявили эти переменные в верхней части функции, поэтому все переменные в JavaScript должны быть объявлены в самом начале вашей функции.

...