Google Maps事件侦听器在Javascript'for'循环中无法正常工作

Question

我正在尝试设置一个Google地图实例,其中为一组点动态生成一些内容.

现在,我正在使用for循环遍历任意数量的纬度和经度值,并创建标记是地图上的那些点.

我正在尝试添加与这些标记相对应的信息窗口,并在单击标记时弹出它们.

但是,我遇到了一些麻烦.除了eventListener部分之外,它看起来像我的for循环基本上创建了一切正常工作:

function drawMap(points) {
    popUps = new Array();
    infoWindows = new Array();
    positions = new Array();

    contents = '<div id = "content">' +
        '<div id="siteNotice">' +
        '</div>' +
        '<p id="firstHeading" class="firstHeading">Position</h1>' +
        '</div>';

    infowindow = new google.maps.InfoWindow({
        content: contents
    });

    for( i = 0; i < points.length; i++ ){
        positions[i] = new google.maps.Marker({ position: 
        latlng[i], 
        map:map, 
        title:"Position"});

        popUps[i] = '<div id = "content">' +
            '<div id="siteNotice">' +
            '</div>' +
            '<p id="firstHeading" class="firstHeading">Position</h1>' +
            '</div>';

        infoWindows[i] = new google.maps.InfoWindow({
            content: popUps[i]
        });

    // everything up to this point works fine, I can reference it all manually
    // and get back the expected value.

        google.maps.event.addListener(positions[i], 'click', function(){
            infoWindows[i].open(map, positions[i]);                 
        });

    // if I change each instance of "i" to "0" here, I'll get a popup on the
    // expected marker containing content that I defined in this for loop. Same for
    //  "1" and "2." But "i" doesn't work.
    }
}

其中"map"是google.maps.Map的一个实例,popUps的每个实例在最终产品中都会有所不同.

我在页面加载时调用此函数,这会向我的地图添加位置和标记:

drawMap([[13.283 , 162.232], [18.232 , 112.223], [17.233, 80.293]]);

有谁知道为什么我无法动态创建eventListeners？任何帮助将不胜感激!

提前致谢.:)

编辑:

事实证明,这里的要求只是在页面加载时弹出div.我甚至不需要事件监听器......

但是,两个答案都很好,并帮助我弄清楚如何使原始代码工作,所以谢谢.:d

Answer 1

在infowindow声明之后,创建一个添加地图侦听器的函数.该函数将创建一个闭包并冻结i传递给它的值.

...
infowindow = new google.maps.InfoWindow({
        content: contents
    });

var addListener = function (i) {

google.maps.event.addListener(positions[i], 'click', function(){
        infoWindows[i].open(map, positions[i]);                 
    });
   ...

}

然后在for循环中调用它:

addListener(i);