Question

我有一个显示地图和名单列表的页面。标记显示在地图上，列表正确填充，但是当单击标记或列表时，我似乎无法使用正确的contentstring值打开标记。

单击标记时，它始终显示最后一个内容字符串，单击列表中的项目时，它始终会打开系列中的最后一个标记。

我希望这些信息可以继续下去。我只是看起来infowindow.setcontent和infowindow.open正在拿起正确的项目编号。

    HERE ARE SOME VARIABLES THAT ARE BEING USED IN THE CODE BELOW:
    data[i][3] = firstname
    data[i][4] = lastname
    data[i][6] = latitude
    data[i][7] = longitude

任何帮助将不胜感激！

由于凯文

    contentString = new Array();

    for (var I = 0; I < data.length; I++) {

contentString[I] = '<b>' + data[I][3] + ' ' + data[I][4] + '</b>';
var thismarker = I;
var marker = new google.maps.Marker({
    position: new google.maps.LatLng(data[I][6],data[I][7]),
    map: map,
    zIndex: I
});
$("<li />")
    .html('<span class="leadid">' + I + '</span>' + '<div class="leadname">' + data[I][3] + ' ' + data[I][4] + '</div>')
    .click(function(){
        infowindow.close();
        infowindow.setContent(contentString[thismarker]);
        infowindow.open(map, markers[thismarker]);
    })
.appendTo("#leadList"); 
google.maps.event.addListener(marker, "click", function(e){
    infowindow.close();
    infowindow.setContent(contentString[thismarker]);
    infowindow.open(map, markers[thismarker]);
});
markers[I] = marker;
    }

Answer 1

这里的问题是你在循环中设置了单击处理程序并尝试在闭包中引用循环变量I（通过thismarker - 这是相同的事情）。变量I和thismarker在每次循环迭代时都会更新，并且点击处理程序中的引用也会更新。因此，在 all 中，点击处理程序thismarker指的是分配给该变量的 last 值。（这就是为什么在循环中定义函数通常是一个坏主意，如果你可以避免它。）

有几种不同的方法可以解决这个问题;最简单的，但不一定是最美的，是在匿名函数中包装有问题的代码，并将循环变量作为参数传递：

for (var I = 0; I < data.length; I++) {
    // ... snip ...

    // start of anonymous function
    (function(thismarker) {
        // within the scope of this function,
        // "thismarker" will work as expected
        $("<li />")
            .html('<span class="leadid">' + I + '</span>' + '<div class="leadname">' + data[I][3] + ' ' + data[I][4] + '</div>')
            .click(function(){
                infowindow.close();
                infowindow.setContent(contentString[thismarker]);
                infowindow.open(map, markers[thismarker]);
            })
            .appendTo("#leadList"); 
        google.maps.event.addListener(marker, "click", function(e){
            infowindow.close();
            infowindow.setContent(contentString[thismarker]);
            infowindow.open(map, markers[thismarker]);
        });
    })(I); // end anonymous function, calling with loop variable
}

循环谷歌地图标记与jquery无法正常工作

1 个答案: