javascript - Google maps infoWindow - 关闭时会破坏内容吗？

Question

我在我的网站上使用谷歌地图。我有一个信息窗口，其中填充了如下内容:

infowindow = new google.maps.InfoWindow({ content: $('infoWindowContent') });

google.maps.event.addListener(mapMarker, 'click', function() {
    $('infoWindowContent').setStyle('display','block');

    $('iw_companyName').innerHTML = "stuff";
    $('iw_recommends').innerHTML = "stuff";
    $('iw_activity').innerHTML = "stuff";

    infowindow.open(googleMap,item);

});

$('infoWindowContent') 是我在 html 中创建的页面元素:

<div id="mapholder" class="box">
    <div id="infoWindowContent" style="display:none;">
        <div class="center">
            <h4><a id="iw_companyName"></a></h4>
            <div>Activity: <a id="iw_activity"></a></div>
            <div id="iw_recommends"></div>
        </div>                        
    </div>                
    <div id="map_canvas"></div>
</div>

所以当页面被创建时，内容是不可见的。当用户单击标记时，信息窗口会出现在那里，内容会填充适当的值。如果用户单击另一个标记，信息窗口将移动，并更改其值。

问题是当用户单击信息窗口顶部的“x”按钮将其关闭时。关闭功能工作正常，但是当用户再次单击标记时，出现以下错误:

$("infoWindowContent") is null
[Break On This Error] $('infoWindowContent').setStyle('display','block');

因此，$('infoWindowContent') 在 infoWindow 关闭时被销毁。

我该如何解决这个问题？每次用户单击标记时，我真的不想在 javascript 中构建一个新的 infoWindowContent，因为以这种方式生成的 html 更难阅读/理解/更改。还是我解决问题的方式有问题？

Answer 1

现在有问题了。您正在将 div 对象设置为 infoWindow 的内容。因此，整个对象在关闭 infoWindow 后被销毁。这是修复方法，仅将 HTML 设置为内容，而不是将对象设置为内容。

infowindow = new google.maps.InfoWindow({ content: $('infoWindowContent').get('html') });