すべてのコードは最後のセクションで上書きされています

Question

私たちはポリゴンを使って国の上にオーバーレイを作成するマップを持っています。ユーザーがある国の上を移動すると、ポリゴンが色を変えます。マウスは、それが戻って変更する（あるいは、少なくとも我々はそれがしたい）国を去る

会社は何が起こるか、以下のコードでは、両国がコードのJUST最後のセクションの設定にアクセスすることをということです。他のコードはすべて上書きされているようです。

どの変数を一意にするかわかりません。

for(var i = 0; i < germany.length; i++){ 
    addListener(germany[ i ], germany); 
    } 
function addListener(germany_item, tweened) 
{ 
    google.maps.event.addListener(germany_item, "mouseover",function() { 
        for(var i in tweened) 
     tweened[ i ].setOptions({ fillColor: "#DD732B", strokeColor: "#DD732B" }); 
    }); 
    google.maps.event.addListener(germany_item, "mouseout",function() { 
        for(var i in tweened) 
     tweened[ i ].setOptions({ fillColor: "#5EA9BD", strokeColor: "#5EA9BD" }); 
    }); 
}// 
for(var i = 0; i < france.length; i++){ 
    addListener(france[ i ], france); 
    } 
function addListener(france_item, tweened) 
{ 
    google.maps.event.addListener(france_item, "mouseover",function() { 
        for(var i in tweened) 
     tweened[ i ].setOptions({ fillColor: "#DD732B", strokeColor: "#DD732B" }); 
     }); 
    google.maps.event.addListener(france_item, "mouseout",function() {  
        for(var i in tweened) 
      tweened[ i ].setOptions({ fillColor: "#006886", strokeColor: "#006886" }); 
     }); 

Answer 1

あなたは（あなたがfunction addListener()の2つのコピーを持っている）同じ名前の2つの機能を持つことはできません。そうすると、最後のものだけがアクティブになります（これはあなたが経験しているものです）。両方の関数の名前をaddListenerGermany()とaddListenerFrance()に変更するか、その両方を1つの関数に置き換え、その2つの小さな差をパラメータとして渡して、両方のニーズに1つのコードブロックで対応できるようにすることをお勧めします。

function initCountry(country, fill, stroke) { 
    for (var i = 0; i < country.length; i++) { 
     addListenerCommon(country[i], country, fill, stroke); 
    } 
} 

initCountry(germany, "#5EA9BD", "#5EA9BD"); 
initCountry(france, "#006886", "#006886"); 
initCountry(australia, "#FF6886", "#FF6886"); 

：あなたはより多くの国を追加するつもりなら、あなたは、forループのための関数を作ることができます

for (var i = 0; i < germany.length; i++) { 
    addListenerCommon(germany[ i ], germany , "#5EA9BD", "#5EA9BD"); 
} 

for(var i = 0; i < france.length; i++) { 
    addListenerCommon(france[ i ], france, "#006886", "#006886"); 
} 

function addListenerCommon(item, tweened, fill, stroke) { 
    google.maps.event.addListener(item, "mouseover",function() { 
     for(var i in tweened) { 
      tweened[ i ].setOptions({ fillColor: "#DD732B", strokeColor: "#DD732B" }); 
     } 
    }); 
    google.maps.event.addListener(item, "mouseout",function() { 
     for(var i in tweened) { 
      tweened[ i ].setOptions({ fillColor: fill, strokeColor: stroke }); 
     } 
    }); 
} 

：

たとえば、あなたはこれにそれをすべて変更することができます...

Answer 2

this related questionを参照してください。 function myFunction()構文を使用すると、実行時ではなく解析時に関数が定義されるため、最後の宣言が最初のものを上書きします。実行時に定義されているvar myFunction = function()構文を使用して修正できます。