9

ここに似た質問があります: Javascript ループ内のイベント ハンドラー - クロージャーが必要ですか? しかし、私はjQueryを使用しており、指定されたソリューションは、クリックではなくバインドされたときにイベントを発生させるようです。

これが私のコードです：

for(var i in DisplayGlobals.Indicators)
{
    var div = d.createElement("div");
    div.style.width = "100%";
    td.appendChild(div);

    for(var j = 0;j<3;j++)
    {
        var test = j;
        if(DisplayGlobals.Indicators[i][j].length > 0)
        {   
             var img = d.createElement("img");
             jQuery(img).attr({
                     src : DisplayGlobals.Indicators[i][j],
                     alt : i,
                     className: "IndicatorImage"
              }).click(
                     function(indGroup,indValue){ 
                         jQuery(".IndicatorImage").removeClass("active");
                         _this.Indicator.TrueImage = DisplayGlobals.Indicators[indGroup][indValue];
                         _this.Indicator.FalseImage = DisplayGlobals.IndicatorsSpecial["BlankSmall"];
                         jQuery(this).addClass("active"); 
                     }(i,j)
               );
               div.appendChild(img);   
          }
     }
}

私は成功せずにいくつかの異なる方法を試しました...

元の問題は、適切な画像を選択するためにパラメーターではなくループ カウンターを使用していたため、_this.Indicator.TrueImage が常に最後の値になることでした。

4

3 に答える 3

14

関数がありません。.click 関数にはパラメーターとして関数が必要なので、これを行う必要があります。

.click(
    function(indGroup,indValue)
    {
        return function()
        {
            jQuery(".IndicatorImage").removeClass("active");
            _this.Indicator.TrueImage = DisplayGlobals.Indicators[indGroup][indValue];
            _this.Indicator.FalseImage = DisplayGlobals.IndicatorsSpecial["BlankSmall"];
            jQuery(this).addClass("active"); 
        }
    }(i,j);
);
于 2008-12-11T14:22:55.437 に答える
13

Gregによる解決策は引き続き有効ですがeventData、jQueryクリックメソッド（または、バインドまたはその他のイベントバインディングメソッド）のパラメーターを利用することで、追加のクロージャーを作成せずに実行できます。

.click({indGroup: i, indValue : j}, function(event) {
    alert(event.data.indGroup);
    alert(event.data.indValue);
    ...
});

はるかに単純で、おそらくより効率的に見えます（反復ごとのクロージャーが1つ少なくなります）。

bindメソッドのドキュメントには、イベントデータに関する説明といくつかの例があります。

于 2010-10-21T17:00:16.283 に答える
6

jQuery 1.4.3 以降を使用している限り、Nikitaの回答は正常に機能します。これより前のバージョン (1.0 に戻る) では、次のようにbindを使用する必要があります。

.bind('click', {indGroup: i, indValue : j}, function(event) {
    alert(event.data.indGroup);
    alert(event.data.indValue);
    ...
});

これが、まだ 1.4.2 を使用している他の誰か (私のような) に役立つことを願っています。

于 2011-03-27T01:06:14.290 に答える