Google Maps V3：通过AJAX加载infowindow内容

使用ajax将内容加载到我的infowindow中的最佳方法是什么？ 现在我正在使用iframe获得类似的效果，但我并不那么满意。 我认为这将是直接的，但由于某种原因令我困惑。 这就是现在的工作方式：

var markers = []; var infowindow = new google.maps.InfoWindow(); $.each(JSON.parse(aulas), function(i, a){ var latlng = new google.maps.LatLng(a.aula.lat, a.aula.lng); var marker = new google.maps.Marker({ position : latlng, title: a.aula.title }); google.maps.event.addListener(marker, 'click', function() { infowindow.close(); infowindow.setContent("<div class='infowindow_content'><iframe src='aulas/show/" + a.aula.id + "'></iframe</div>"); infowindow.open(map, marker); }); markers.push(marker); }); 

在infowindow.setContent调用之前，通过ajax抓取内容是很容易的，但是我只想在infowindow打开的时候调用ajax。 有什么想法吗？

顺便说一句：我正在使用jQuery。

正如答案中所build议的，我决定将调用移动到setContent并打开到一个单独的函数。 对于那些有兴趣解决这个问题的代码是：

 function load_content(marker, id){ $.ajax({ url: 'aulas/show/' + id, success: function(data){ infowindow.setContent(data); infowindow.open(map, marker); } }); } 

然后改变监听器：

  google.maps.event.addListener(marker, 'click', function() { infowindow.close(); load_content(marker, a.aula.id); }); markers.push(marker); }); 

Answer 1

信息窗口显示后，您可以随时调用infowindow.setContent 。 所以你可以初始设置你的信息窗口的内容与微调，使AJAX调用（从事件处理程序），然后再次从AJAX响应与适当的数据调用infowindow.setContent 。

Answer 2

 for (var i = 0; i < markersClient.length; i++) { var location = new google.maps.LatLng(lats[i], longs[i]); var marker = new google.maps.Marker({ position: location, map: map, lid: markersClient[i].t }); var infowindow = new google.maps.InfoWindow({ content: "" }); //debugger; marker.setTitle(" - "); markers.push(marker); google.maps.event.addListener(marker, 'click', function (target, elem) { infowindow.open(map, marker); $.ajax({ success:function () { infowindow.setContent(contentString); } }); 

intitalize map，marker，infowindow（不包含内容）和标记点击处理程序发出ajax请求

Answer 3

infoWindow的内容已经被加载，但是如果你正在上传大尺寸的图片，那么我们不得不等待第一次加载图片，然后设置infowindow的内容，然后显示infowindow。 上述要求的解决scheme是好的，但对于图像，它可能不会立即加载，所以要做的，你必须检查infowindow的内容是否加载或只有你必须显示信息窗口。