Javascript 谷歌地图：向每个多边形添加单击侦听器

我正在开发一个Web应用程序。 我有一个谷歌地图，我从数组中添加多边形。我在数组中循环并将多边形添加到地图中。我还需要向多边形添加一个事件侦听器，单击并提醒多边形的位置

这就是我正在做的

map = new google.maps.Map(document.getElementById('map_canvas'),
    mapOptions);
//Loop on the polygonArray
for (var i = 0; i < polygonArray.length; i++) {
    //Add the polygon
    var p = new google.maps.Polygon({
        paths: polygonArray[i],
        strokeWeight: 0,
        fillColor: '#FF0000',
        fillOpacity: 0.6,
        indexID: i
    });
    p.setMap(map);

    //Add the click listener
    google.maps.event.addListener(p, 'click', function (event) {
        //alert the index of the polygon
        alert(p.indexID);
    });
}

map=new google.maps.map（document.getElementById（'map_canvas'），
地图选项）；
//多边形上的环
对于（变量i=0；i

问题

多边形都绘制正确。但问题是，当我尝试单击多边形时，它总是显示最后一个索引。这就像它只是单击最后添加的多边形。我认为当我添加一个新的侦听器时，它会覆盖旧的侦听器。如何为添加的每个多边形添加侦听器，以提醒正确的索引

谢谢，这是正常的行为。 我可以想到两种解决方案：

1） 我相信您可以从上下文中找到多边形（我没有测试它）：

2） 您也可以使用一些：

var addListenersOnPolygon=函数（多边形）{
google.maps.event.addListener（多边形，'click'，函数（事件）{
警报（多边形索引）；
});  
}
map=new google.maps.map（document.getElementById（'map_canvas'），
地图选项）；
//多边形上的环
对于（变量i=0；i

在for循环中移动代码块

//Add the click listener
    google.maps.event.addListener(p, 'click', function (event) {
        //alert the index of the polygon
        alert(p.indexID);
    });

或

将此添加到for循环中

p.addListener('click', clickSelection);

这样做

function clickSelection(){
alert("Clicked");
}

---

此问题本质的可能重复之处在于，所有

函数（事件）

闭包以及循环块共享相同的

p

。因此，当循环执行时，

p

被绑定到最后创建的多边形。我会使用

polygerray.forEach

来分离变量。使用

let

而不是

var

p.addListener('click', clickSelection);

function clickSelection(){
alert("Clicked");
}