0

leaflet.js を使用して一連のポイントをプロットする単純な js プロジェクトを作成しました。

次に、クリックイベントでポイント固有のデータを情報ウィンドウに入力したいと思います。しかし、私はそれを機能させることができないようです。

これはおおよそ私がやったことです：

var circle = L.circle(
    [data[i]['latitude'], data[i]['longitude']],
    50,
    { color: 'red', fillColor: 'red', fillOpacity: .5}
).addTo(map)
.bindPopup(data[i]['SCHNAME'])
.on('click', fill_info_window(data, i));

function fill_info_window(data, i){ /* fill data */ }

残念ながら、ウィンドウが最新のデータで自動的に埋められます。

なぜ機能しないのですか？

ここでプロジェクトを見ることができます：

http://www.thisisstaffordshire.co.uk/images/localpeople/ugc-images/275796/binaries/leaguetableTemplate.html

4

2 に答える 2

3

この行で：

.on('click', fill_info_window(data, i));

...参照するだけでなく、関数を呼び出しています。fill_info_windowあなたはこのようなことをしたい:

.on('click', function() {
    fill_info_window(data, i);
});

あなたがループに入っている場合を除きます（そのi変数は、おそらくあなたがいると思います）。あなたがそうなら、次に：

.on('click', makeHandler(data, i));

...makeHandler次のようになります。

function makeHandler(theData, index) {
    return function() {
        fill_info_window(theData, index);
    };
}

私の最初の答えをループに入れたくない理由は、すべてのハンドラーが同じ変数dataとi変数を参照し、ハンドラーが登録されたときではなく、呼び出されたときの値を参照するためです。そのため、代わりに関数を使用して、makeHandler変更されないものに対してクロージャーを作成します。私のブログの詳細:閉鎖は複雑ではありません

于 2012-12-13T10:01:12.350 に答える
0

関数を呼び出した結果ではなく、ハンドラーとして関数をバインドすることをお勧めします。したがって、呼び出しを削除して、を使用します….on('click', fill_info_window);。イベント処理に関するこのquirksmodeの記事も参照してください：括弧なし！。

于 2012-12-13T09:59:23.603 に答える