谷歌地图 v3 的 PHP javascript 关闭问题

Question

我的应用程序在从 MySQL 数据库读取的 map 上绘制了一堆标记，我想在每个信息窗口中显示一些内容。我的问题是 infowindows 将只显示我数据库中最后一个条目的内容。下面是我的代码，我只是尝试显示位置的名称。我已经尝试提醒变量以查看它们是否确实显示了正确的内容，它们确实是。我意识到这是一个 javascript 闭包问题，但我不知道如何解决这个问题。

var startLat;
var startLng;
var locationName;

<?php foreach($workstations as $workstation):?>
    startLat = "<?php echo $workstation['lat']?>";
    startLng = "<?php echo $workstation['lng']?>";
    locationName = "<?php echo $workstation['name']?>";

    var marker = new google.maps.Marker({
        position: new google.maps.LatLng(startLat, startLng),
        map: map,
        icon: "images/purple.png"
    });

    //load all the infowindow content
    var contentString = [
                    '<div id="InfoText" style="margin: 0px; padding: 0px; overflow: hidden; border:0px">',
                    '<div class="tabs"><ul><li><a href="#tab1">General</a></li>',
                    '<li><a href="#tab2">General 2</a></li></ul>',
                    '<div id="tab1">',
                    '<b>' + locationName + '</b> - ' + locationName + '<BR>',
                    '<input id="save" type="submit" value="Reserve Today" onclick="saveStation(addMarker)" />',
                    '</div>',
                    '<div id="tab2">',
                    '</div>',
                    '</div>'
                           ].join('');

    //alert(contentString);
    var infowindow = new google.maps.InfoWindow({content: contentString});

    new google.maps.event.addListener(marker, 'click', (function(marker) {
        return function(){
            infowindow.open(map, marker);
            }
        })(marker));
<?php endforeach;?>

Answer 1

是的。这是一个js关闭问题。您有一个变量“标记”，所有 map 事件监听器都指向它。试试这个:

将它放在顶部(在 foreach 循环之前):

function addMarkerListener( mark, mp, win )
{
    new google.maps.event.addListener(
          mark, 
          'click', 
          function(){win.open(mp,mark)}
}

然后，在您的代码块末尾添加以下内容而不是监听器:

addMarkerListener( marker, map, infowindow );

基本上，您的版本中发生的事情是 js 说，“好的，我将创建一个函数并让标记变量填充它。知道了。”当真正调用该函数时，它会说，“我正在寻找变量‘marker’，那个变量里有什么？”不幸的是，这同时已被重新分配，现在它代表最新分配。

另一方面，这里的版本告诉 JavaScript，“我有这些全新的变量，它们只存在于这里，所以不要在其他任何地方寻找它们。当其中一个被点击时，然后显示相关的值对它。”单击该项目时，JS 说，“嗯......这个变量只分配给在这个上下文中使用，所以我想我会使用它。”

我可以进入变量绑定(bind)，其中涉及一些令人兴奋的 Lambda 微积分，但这对于这个范围来说有点多。