Javascript 谷歌地图打破JS循环

下面是我的代码，我在几乎相同的代码中遇到了一个问题，它在StackOverflow上被修复了，但是，同样，它不起作用。我没有更改工作代码，但我确实将其包装到了

for…in

循环中，您将在下面看到。问题是，无论我单击什么标记，它都会触发放置的最后一个标记/信息窗口

$(function(){
    var latlng = new google.maps.LatLng(45.522015,-122.683811);
    var settings = {
        zoom: 10,
        center: latlng,
        disableDefaultUI:true,
        mapTypeId: google.maps.MapTypeId.SATELLITE
    };
    var map = new google.maps.Map(document.getElementById("map_canvas"), settings);
    $.getJSON('api',function(json){
        for (var property in json) {
            if (json.hasOwnProperty(property)) {
                var json_data = json[property];
                var the_marker = new google.maps.Marker({
                    title:json_data.item.headline,
                    map:map,
                    clickable:true,
                    position:new google.maps.LatLng(
                        parseFloat(json_data.item.geoarray[0].latitude),
                        parseFloat(json_data.item.geoarray[0].longitude)
                    )
                });
                var infowindow = new google.maps.InfoWindow({
                    content: '<div><h1>'+json_data.item.headline+'</h1><p>'+json_data.item.full_content+'</p></div>'
                });
                new google.maps.event.addListener(the_marker, 'click', function() {
                    infowindow.open(map,the_marker);
                });
            }
        }
    });
});

$（函数（）{
var latlng=新google.maps.latlng（45.522015，-122.683811）；
变量设置={
缩放：10，
中心：拉特林，
disableDefaultUI:true，
mapTypeId:google.maps.mapTypeId.SATELLITE
};
var map=new google.maps.map（document.getElementById（“map_canvas”），设置）；
$.getJSON（'api'，函数（json）{
for（json中的var属性）{
if（json.hasOwnProperty（property））{
var json_data=json[property]；
var the_marker=new google.maps.marker({
标题：json_data.item.headline，
地图：地图，
可点击：正确，
职位：新google.maps.LatLng(
parseFloat（json_data.item.geoarray[0].latitude），
parseFloat（json_data.item.geoarray[0].经度）
)
});
var infowindow=new google.maps.infowindow({
内容：'+json_数据.item.headline+''+json_数据.item.full_内容+'
'
});
新的google.maps.event.addListener（_标记'click'，函数（）{
infowindow.open（地图，_标记）；
});
}
}
});
});

---

谢谢你，不管是谁弄明白了这一点

当您创建每个事件处理程序闭包（函数）时：

…它们每个都得到一个变量

的持久引用，而不是创建闭包时的值。因此，该闭包函数的所有副本都使用相同的值（循环中分配给它的最后一个值）。闭包并不复杂（），但假设您不是第一个犯此错误的人。：-）这很容易做到

因此，您要做的是捕获循环迭代中\u标记的值，这很容易做到：

new google.maps.event.addListener(
    the_marker,
    'click',
    buildHandler(map, the_marker));

function buildHandler(map, marker) {
    return function() {
        infowindow.open(map, marker);
    };
}

在这里，我们有一个函数，它使用传递到函数中的参数来构建处理程序，并且我们在每次循环迭代中调用该函数来为我们创建处理程序

关于SO的另一个问题可能会帮助您可视化闭包如何访问变量。
Sweet！工作，嗯，我有另一个问题，但我想我可以从中找到答案。。。相同的内容（参见infowindow变量）显示在每一个窗口中。因此，我试图创建一个函数来捕获它的值。再次感谢！很好，事实上，在buildHandler函数中添加了var infowindow，效果非常好，非常感谢@奥斯卡：啊！我错过了每个循环上的变化。但是，嘿，把它称为“作为读者练习的左侧”部分
new google.maps.event.addListener(
    the_marker,
    'click',
    buildHandler(map, the_marker));

function buildHandler(map, marker) {
    return function() {
        infowindow.open(map, marker);
    };
}