谷歌地图V3：通过AJAX加载infowindow内容

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

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的内容，但我想要的信息窗口打开的时候才使Ajax调用。有什么想法吗？

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

正如答案中的建议，我决定将调用移动到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); 
    });

来源

2010-08-01 mikewilliamson

让我知道如果我需要澄清我的回答:) – RedBlueThing 2010-08-02 06:38:53

不，那是完美的。我的想法变得混乱了，我只需要轻轻地向正确的方向推动。谢谢！ – mikewilliamson 2010-08-02 22:47:05

没问题:)很高兴帮助。 – RedBlueThing 2010-08-02 23:39:11

你可以在任何地方调用infowindow.setContent已经显示出信息窗口后。因此，您可以使用微调器初始设置您的信息窗口内容，使AJAX调用（来自事件处理程序），然后再次使用适当的数据从AJAX响应中调用infowindow.setContent。

来源

2010-08-01 13:30:55 RedBlueThing

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地图，标记，信息窗口（如没有内容）和标记的点击处理使Ajax请求

来源

2013-10-18 07:49:51

点击了哪个标记，如何从市场向ajax发送参数？ – Marwan 2017-10-22 10:49:40

这是错误的方法，因为它每次点击标记时都是ajax。尝试通过ajax加载最初的所有内容并进行渲染。 – 2017-11-15 09:42:34

@ashishbansal，你可以通过设置一些变量到该范围来通过AJAX有条件地加载内容。 – 2017-11-20 12:57:40

已经在内容的信息窗口加载，但也有可能，如果你上传的图片大尺寸，那么我们必须等待第一次完全加载图像，然后设置infowindow的内容，然后显示该infowindow。上述要求的解决方案是可以的，但对于可能无法立即加载的图像，要做到这一点，您必须检查infowindow的内容是否已加载，只有您必须显示信息窗口。

来源

2015-05-22 05:05:29 bikashphp

谷歌地图V3：通过AJAX加载infowindow内容

回答

相关问题