$.getJSON, google.maps.infowindow 和内容字符串

$.getJSON, google.maps.infowindow and content string

代码应该添加一个点击事件,其中一个信息窗口在标记上打开,其中包含来自 PHP 页面的数据,并且 "works" 除了第一个信息窗口打开空白(只是说 h1 中的新闻) 然后我打开的每个其他信息窗口都包含最后一个标记的内容。谁能告诉我如何解决它?

//broken part
marker.addListener('click', function() {
    $.getJSON('articles.php/GET?geo='+ marker.title)
    .done(function(data, textStatus, jqXHR) {   
        $.each(data, function() {
            contentString=contentString + '<li><a href=' + data[counter].link + '>' +data[counter].title + '</a></li>' ;
            counter++;
        });         
    });

    contentString=contentString + '</ul></div>' ;
    var infowindow= new google.maps.InfoWindow({
        content: contentString  
    });

    infowindow.open(map, marker);
    counter=0 ;
    contentString='<div align="center"><h1>news</h1><br></div><div align="left" colour="blue"><ul>';
});

$.getJSON是异步的,需要在它的回调函数里面使用数据,when/where可用(在.done函数里面)

marker.addListener('click', function() {
    $.getJSON('articles.php/GET?geo='+ marker.title)
    .done(function(data, textStatus, jqXHR) {   
        $.each(data, function() {
            contentString=contentString + '<li><a href=' + data[counter].link + '>' +data[counter].title + '</a></li>' ;
            counter++;
        });         
        contentString=contentString + '</ul></div>' ;
        var infowindow= new google.maps.InfoWindow({
            content: contentString  
        });

        infowindow.open(map, marker);
        counter=0 ;
        contentString='<div align="center"><h1>news</h1><br></div><div align="left" colour="blue"><ul>';

    });
});