jQueryの$ .eachの変な動作

Question

私は、MySQLデータベースからSVGパスを取得し、raphaeljs.comのスクリプトを使用してシェイプを描画するコードを書いています。私はonmouseoverプロパティに問題があります：私はそれらを持っているときに、それぞれの図形を別の塗りつぶし色にしたいのですが、何が起こるかは、図形のどれかを動かすと、描かれた最後の図形は色づけされ、ホバリング。ここ

は、データに含まれる図形を描画するJS関数のコードは次のとおり

function drawShapes(data,geolevel,transparent){ 
    $.each(data, function(code,shape){ 
     var contour = shape.contour.split(" "); 
     attributes = {}; 
     attributes["fill"] = (transparent ? "none" : shape.fillcolor); 
     attributes["fill-opacity"] = "0.75"; 
     attributes["stroke"] = shapeProperties[geolevel]["stroke"]; 
     attributes["stroke-width"] = shapeProperties[geolevel]["stroke-width"]; 

     index = shapeProperties[geolevel]["prefix"] + code; 
     shapes[index] = drawPath("M " + contour.join(" ") + " z").attr(attributes); 
     shapes[index].fill = shape.fillcolor; 
     if (!transparent) { 
      shapes[index][0].onmouseover = function() { 
       shapes[index].attr({fill: hoverfill}); 
      }; 
      shapes[index][0].onmouseout = function() { 
       shapes[index].attr({fill: shapes[index].fill}); 
      }; 
     } 
    }); 
} 

shapePropertiesは、その種類に応じた形状のプロパティを含むグローバル変数（オブジェクト）です。

私のonmouseoverに何か問題はありますか？ 私のスクリプトはこのデモに基づいています：http://raphaeljs.com/australia.html

ありがとうございます！

Answer 1

この行：それはあなたの問題の原因である可能性があり、グローバル変数を、宣言しているよう

index = shapeProperties[geolevel]["prefix"] + code; 

が見えます。 varキーワードを使用して、そのスコープを関数に設定します。