Google Maps API 信息窗口都具有相同的内容答案

【问题标题】：Google Maps API infowindows all have the same contentGoogle Maps API 信息窗口都具有相同的内容
【发布时间】：2015-04-29 16:00:55
【问题描述】：

我有一个循环问题中的旧信息窗口，其中最后一个循环的内容显示在所有信息窗口中。是的，我知道 Stack Overflow 上已经有几个关于此的问题，但似乎没有一个对我有用。

这是我的 JavaScript：

var map;
var geocoder;

$(function () {

    var mapOptions = {
        zoom: startZoom,
        center: new google.maps.LatLng(startLat, startLng)
    }
    var marker, i;

    $('#map-canvas').height($('#map-canvas').width() / 2);
    var mapOptions = {
        zoom: startZoom,
        center: new google.maps.LatLng(startLat, startLng)
    }
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

    if ( ! isAddress && $('#country').val() > 0) {
        geocoder = new google.maps.Geocoder();
        geocoder.geocode({'address': $('#country').find('option:selected').text()}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                map.setCenter(results[0].geometry.location);
                map.fitBounds(results[0].geometry.viewport);
            }
        });
    }

    for (i = 0; i < distributors.length; i++) {
        var $distributor = distributors[i];
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng($distributor.latitude, $distributor.longitude),
            map: map
        });
        var infowindow = new google.maps.InfoWindow();
        var html = '<div class="container-fluid" style="width: 300px">\
            <h1 class="row-fluid">\
                '+($distributor.logo ? '<div class="span3"><img src="'+$distributor.logo+'" style="width: 100%"></div>' : '')+'\
                <span class="span9">'+$distributor.name+'</span>\
            </h1>\
            <div class="row-fluid">\
                <div class="span6">'+$distributor.address+'<br>'+$distributor.postcode+'</div>\
                <div class="span6">'+($distributor.url ? '<a href="'+$distributor.url+'">'+$distributor.url+'</a>' : '')+'<br>'+$distributor.contactNumber+'</div>\
            </div>\
        </div>';

        google.maps.event.addListener(marker, 'click', (function(marker, i) {
            return function() {
                infowindow.setContent(html);
                infowindow.open(map, marker);
            }
        })(marker, i));
    }

})

到目前为止，我已经尝试过this answer，但提到的变量与我所拥有的不匹配，我无法让它们匹配，它只是不起作用。

我也尝试过this answer，但它没有得到不同的内容，而是删除了我的所有标记。

我做错了什么？有人可以帮我解决这个问题吗？

【问题讨论】：

这是一个封闭范围问题。查看类似的问题和答案：stackoverflow.com/questions/3158598/…
如果确实是一个不同的问题，请提供一个Minimal, Complete, Tested and Readable example 来证明这个问题。你的 HTML/CSS 是什么样的？能否提供样本数据？
@geocodezip 我没有说这是一个不同的问题，我说另一个答案中提供的方法要么对我不起作用，要么我无法弄清楚如何实现它们，因为我的目前是代码。

标签： javascript google-maps-api-3

【解决方案1】：

在创建 infoWindow 和 html 对象后试试这个：

marker.html = html;

然后像这样构建你的事件监听器：

google.maps.event.addListener(marker, 'click', function () {
                    infoWindow.setContent(this.html);
                    infoWindow.open(map, this);
                });

【讨论】：