jQuery.each 覆盖帖子答案

【问题标题】：jQuery.each overwrites postsjQuery.each 覆盖帖子
【发布时间】：2015-07-17 14:56:36
【问题描述】：

我在 Pimcore 后端使用地址。地址进入地理编码器，它将用于从地址中获取纬度和经度。在此之后，经度和纬度存储在后端（Pimcore）中。这工作得很好。

下一步是给出所有地址，以便它们显示在前端的地图上。设置标记并显示 POI 的地址。我实现了一个滚动到地图的链接，将缩放设置为 16 并以 POI 为中心。

我的问题是只显示最后一个 POI，无论我点击哪个地址链接（它滚动到地图并放大......但总是显示最后一个 POI）。这让我觉得不知何故我的jQuery.each 覆盖了所有的点，所以只有最后一个保留。如果我console.log 纬度和经度点它们适合并且适合地址。

也许我在监督某些事情，或者我错过了在此功能中至关重要的某些特定部分。我希望这对你有意义，如果有一些问题或者我不具体，让我知道，我会解释更多。问候，丹尼尔

cw.map.prototype.generateMarkersFromvcard = function () {
    var cwMap = this;
    jQuery('.vcard').each(function (k, v) {
        var id = jQuery(v).data('markerid');
        var vCard = v;

        // TODO: only last address is shown
        var lat = jQuery('.latitude [title]', v).attr('title');
        var lon = jQuery('.longitude [title]', v).attr('title');

        console.log('latitude ' + lat + ', longitude ' + lon);

        // Fallback if lat and lon
        if (lat && lon) {

            var point = new google.maps.LatLng(lat, lon);
            var properties = {
                position: point,
                map: map,
                icon: " ",
                labelContent: '<i class="icon-pin map-pin"></i>',
                labelAnchor: new google.maps.Point(24, 48),
                labelClass: "labels" // the CSS class for the label
            };

            // setting the marker to the map
            var marker = new MarkerWithLabel(properties);
            cwMap.infowindow(marker, jQuery('.infowindow', v).html());
            markers[id] = marker;
        }
    });
    return this;
};

【问题讨论】：

你如何创建地址链接？
lat 和 lon 是来自 pimcore 后端数据库的纬度和经度日期。我通过将地址发送到谷歌地图 api 来获取它们。如果我 console.log lat 和 lon 正确的数据被打印到控制台。我现在唯一的问题是每个循环以某种方式覆盖所有数据并且只保存最后一个条目。因此，地图上只显示了一个地址。

标签： jquery google-maps-api-3 each google-geocoder

【解决方案1】：

问题在于您创建信息窗口时。谷歌地图总是获得对最后一个marker的引用的一些方法。

如果您查看此 Google 地图示例 https://developers.google.com/maps/documentation/javascript/examples/event-closure

Google 尝试在函数中使用google.maps.event.addListener(marker, 'click', function() 以避免这种错误引用问题；如果您从函数中复制代码，替换函数调用，此示例将不起作用。看看这个问题发生的例子。

http://jsfiddle.net/Lqshut95/

希望对你有帮助。

【讨论】：