Google Maps V3: загрузка содержимого Infowindow через AJAX

Каков наилучший способ загрузки содержимого в мой infowindow с помощью ajax? Сейчас я получаю аналогичный эффект, используя iframes, но я не настолько доволен этим. Я подумал, что это будет прямо, но почему-то это меня путает. Вот как это работает сейчас:

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);
  });

Было бы легко захватить контент через ajax непосредственно перед вызовом infowindow.setContent, но я хочу сделать вызов ajax только тогда, когда откроется окно infowindow. Любые мысли?

BTW: Я использую 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);
  });

Ответ 1

Вы можете вызвать infowindow.setContent в любой момент после отображения информационного окна. Поэтому вы можете сначала установить содержимое информационного окна с помощью счетчика, сделать вызов AJAX (из обработчика события), а затем снова вызвать infowindow.setContent из ответа AJAX с соответствующими данными.

Ответ 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 (как без содержимого) и обработчик маркера щелкните make ajax request

Ответ 3

Уже загружен контент в infoWindow, но есть вероятность, что если вы загружаете изображения большого размера, мы должны дождаться, когда первый раз загрузим изображение полностью, а затем установите содержимое infowindow, а затем отобразите это infowindow. Решения для вышеуказанного требования одобрены, но для изображений он может не загрузиться мгновенно, поэтому для этого вам нужно проверить, загружен ли контент инфоиндуста или нет, тогда вам нужно отобразить информационное окно.