Google Maps信息框与名称列表开发遇重复问题，JSON已验证有效

嘿，我来帮你捋捋这个列表重复的问题！既然JSON没问题、JSLint也通过了，那大概率是标记点（markers）或信息窗口（infoWindows）数组的逻辑重复填充导致的，结合你给的代码片段，我整理几个常见的排查方向：

• 先检查数组初始化与填充逻辑：
  你定义了全局的arrMarkers和arrInfoWindows，要确认是不是在initMap或者数据加载的函数里，每次执行都没有先清空数组就直接push新内容。比如如果有加载外部数据的逻辑，每次调用加载方法前要先执行arrMarkers = []和arrInfoWindows = []，把旧数据清空，避免新旧数据叠加。另外也要排查循环逻辑，有没有嵌套错误或者重复遍历了同一组数据。

• 再看列表的渲染逻辑：
  如果你是基于arrMarkers来生成名称列表的，要确认渲染列表时是不是没有先清空原有DOM内容就直接追加。比如别用innerHTML +=这种写法，改成先把列表容器的innerHTML设为空，再重新遍历数组生成新的列表项，这样就不会出现重复内容了。

• 最后检查事件绑定的重复触发：
  有没有给地图的idle、bounds_changed这类事件重复绑定了数据加载函数？比如每次地图初始化或者视角变化都重新加载一遍数据，导致数组被重复填充。可以用google.maps.event.clearListeners(map, '事件名')先清除旧的监听，再绑定新的，或者确保监听只绑定一次。

附上你提供的代码片段方便对照：

<script type="text/javascript"> 
var map; 
var arrMarkers = []; 
var arrInfoWindows = []; 
function initMap(){ 
  var centerCoord = new google.maps.LatLng(48.058249, -122.288615); 
  var mapOptions = { 
    zoom: 12, 
    center: centerCoord, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
  }; 
  map = new google.maps.Map(document....
</script>

内容的提问来源于stack exchange，提问作者user2141419