2

作成した Google マップのポリゴン オブジェクトと同じ名前の文字列で満たされた配列があります。特定のオプションを設定するために配列を反復処理したいと思います。コードは次のとおりです。

for (var i = 0; i < statesPoly.length; i++) {
    google.maps.event.addListener(statesPoly[i], 'mouseover', function() {
        statesPoly[i].setOptions({ strokeWeight: '2' });
    });
}

実行すると、スクリプトが文字通り statesPoly[i] を使用しているように見えるため、「undefined のメソッド 'setOptions' を呼び出せません」というメッセージが表示されます。statesPoly[i] を statesPoly[11] などに置き換えると、スクリプトは期待どおりに機能します。

次のようなことを試してみると、ループも期待どおりに機能します。

for (var i = 0; i < statesPoly.length; i++) {
    alert(statesPoly[i].strokeColor);
}

私は何を間違っていますか？

アップデート：

ここに近づく。this場合によってはusing が機能する理由は、関数がオブジェクトを期待しており、それに文字列を与えているためだと思います。これは事実でしょうか？

alert(statesPoly[0]);
        google.maps.event.addListener(sarawakPoly, 'mouseover', function() {
            $("#"+statesPoly[0]).addClass("highlight");
            sarawakPoly.setOptions({ strokeWeight: '2' });
            //infowindow.open(map,marker);
        });

上記のコードは SarawakPoly でアラートを出し、statesPoly[0] を ID の文字列として使用すると期待どおりに動作します。これ

 alert(statesPoly[0]);
        google.maps.event.addListener(statesPoly[0], 'mouseover', function() {
            $("#"+statesPoly[0]).addClass("highlight");
            statesPoly[0].setOptions({ strokeWeight: '2' });
            //infowindow.open(map,marker);
        });

「Uncaught TypeError: 未定義のプロパティ 'mouseover' を読み取れません」ため、機能しません

私が正しければ、JS に配列変数をオブジェクトとしてキャストさせるにはどうすればよいですか?

4

3 に答える 3

5

これは、JavaScript コードでよくある間違いです。

for (var i = 0; i < n; i++) {
    registerSomeCallback(function () {
        console.log(i);
    });
}

ループの反復ごとに変数iがインクリメントされ、JavaScript のレキシカル スコープにより、各反復で定義された関数は同じi変数を共有します。これは、コールバックが呼び出されたとき (あなたの場合は Google マップ イベントが発生したとき)、i常にループが到達した最後の値になることを意味します。

まるであなたがこれをやっているようです：

var i, fn;

i = 0;
fn = function () { alert(i); };
fn(); // will alert "0"
i = 1;
fn(); // i has changed, will now alert "1"
i = 2;
fn(); // i has changed again, will now alert "2"

ループの反復ごとに新しい変数スコープがあることを確認する必要があります。次に例を示します。

for (var i = 0; i < n; i++) {
    (function (n) {
        registerSomeCallback(function () {
            console.log(n);
        });
    }(i));
}

このバージョンのコードでは、各コールバックは独自のカウンター変数を持つ独自の変数スコープで定義されています (これは引き続き を呼び出すことができますが、例をより明確にするために呼び出しました) i。n

于 2012-06-01T19:07:32.273 に答える
2

this代わりに使ってみませんか？

    for (var i = 0; i < statesPoly.length; i++) {
      (function(i) {
        google.maps.event.addListener(statesPoly[i], 'mouseover', function() {
            this.setOptions({ strokeWeight: '2' });
        });
       })(i);
    }
于 2012-06-01T19:06:04.653 に答える
1

statesPoly[i] は未定義です。これは、変数 i が、イベント リスナーにアタッチした新しい関数内で定義されていないためです。

ここでいくつかのことができますが、最も簡単な方法は、この変数を関数に渡すことです。そんな感じ：

google.maps.event.addListener(statesPoly[i], 'mouseover', function(i) {
  statesPoly[i].setOptions({ strokeWeight: '2' });
});
于 2012-06-01T19:10:08.420 に答える