javascript - 多个标记奇怪的点击问题: Google Map API

Question

我可以使用以下代码实现多个标记:

<?php foreach($dummy as $cid=>$data)
{   ?>
    var myLatlng = new google.maps.LatLng(<?php echo $data['lat']; ?>,<?php echo $data['lon']; ?>); 
    var marker = new google.maps.Marker({
          position: myLatlng,
          map: map,
          title: "<?php echo $data['name']; ?>"
    });
    icons[j] = marker;
    maps[0] = map;    
    j++;
<?php  
}   
?>  
for(var i = 0; i < icons.length; i++)
{       
   google.maps.event.addListener(icons[i], 'click', function(){
    markerClick(icons[i], maps[0]); // this is the problem area
    // markerClick(icons[0], maps[0]); // this works
    // markerClick(icons[1], maps[0]); // so does this
   });  
}   

function markerClick(marker_argument, map){     
    console.log(marker_argument);        
 }

问题出在 google.maps.event.addListener 函数上。如果我使用变量 i，则 markerClick() 的 console.log() 返回未定义。但是，如果我使用硬编码值(1、2 或 3)，console.log() 将返回标记对象。

令我困惑的是，为什么如果我使用循环变量i，则参数不会被传递，但如果我硬编码一个值，则参数会起作用。我在这里缺少什么？

Answer 1

将 .addListener 循环封装在 JavaScript 闭包中，它应该可以工作!