文字列のインスタンスに問題があります。var

Question

私はループを実行しており、繰り返しごとにコンテンツと呼ばれる文字列varを設定しています。このvarは、GoogleマップマーカーのinfoWindowを作成するために使用しています。しかし、新しいインスタンスを作成する代わりに、varの値を変更する各反復で、これは値を変更し、マーカのinfoWindowsを常にvarの最後の値に設定します。contentなぜ間違っているのでしょうか。

for (var i = 0; i < info.length; i++) { 

     var marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(info[i].split(',')[5], 
             info[i].split(',')[6]), 
      optimized: false, 
      map: map, 
      zoom: 6, 
      draggable: true, 
      animation: google.maps.Animation.DROP 
     }); 


     var content = '<p>Central: ' + info[i].split(',')[1] + '</p>'; 

     var infoWindow = new google.maps.InfoWindow({ 
      content: content 
     }); 

     google.maps.event.addListener(marker, 'click', function() { 
      infoWindow.open(map, this); 
      currentMarker = this; 
     }); 
    } 

Answer 1

google.maps.event.addListener(marker, 'click', function() { 
    infoWindow.open(map, this); 
    currentMarker = this; 
}); 

すべてのハンドラが同じinfoWindowを開くように、外側の関数の変数に閉鎖とinfoWindowポイントを作成しています。 javascriptには関数スコープしかありません（for、for、forなど）。あなたが望むものを達成するためにクロージャを使用してください：

google.maps.event.addListener(marker, 'click', (function(infoW){ 
    return function() { 
     infoW.open(map, this); 
     currentMarker = this; 
    }; 
})(infoWindow)); 

Answer 2

これは本当に奇妙です。

コンテンツをインラインで作成しようとしましたか？

var infoWindow = new google.maps.InfoWindow({ 
    content: '<p>Central: ' + info[i].split(',')[1] + '</p>' 
});