3

それぞれがSPANである.bulletを持つオブジェクトのリストがあります。jQueryを使用してスパンで特定のアクションを実行するよりも、スパンのクリックをハンドラーにバインドしたいと思います。わからない行動が見られるので、誰かが何が起こっているのか説明してくれることを願っています。基本的に、この最初のコード例は機能します。

for (var i = 0 ; i< length ; i++) {

            (function(){
                dataNode = dataNodeList[i];

                var handler = function(e) {

                    e.data.node.bullet.firstChild.nodeValue = "- ";


                };


                $(dataNode.bullet).on("click",{node:dataNode},handler);


            })();

        }

ただし、この2番目のバリエーションは機能しません。

for (var i = 0 ; i< length ; i++) {

            (function(){
                dataNode = dataNodeList[i];

                var handler = function() {

                    dataNode.bullet.firstChild.nodeValue = "- ";


                };


                $(dataNode.bullet).on("click",handler);


            })();

        }

この2番目の例では、

dataNode.bullet.firstChild.nodeValue = "- ";

意図したSPANの値には影響しません。JavaScriptが閉じているため、dataNode.bulletが変更したいSPANをまだ指していると思っていました。それで、誰かがこれが失敗する理由を説明できますか？ありがとう。

4

1 に答える 1

6

これを試して：

for (var i = 0 ; i< length ; i++) {
    (function(index){
        var dataNode = dataNodeList[index];

        var handler = function() {
            dataNode.bullet.firstChild.nodeValue = "- ";
        };

        $(dataNode.bullet).on("click",handler);
    })(i);
}

クロージャは新しいスコープを定義します。これが必要なのは、ループが終了するまでハンドラーが呼び出されないため、ハンドラーが呼び出さiれた時点ではスコープの一部ではないか、（場合によっては）ループから可能な最後の値を持っているためです。

于 2012-09-19T17:47:10.980 に答える