0

私は JavaScript 初心者です。EventListener を Node.on('click', foo); に追加する必要がありました。そして私の最初の試みは - もちろん - 失敗でした:

var i = 0;
Y.one('#btnDel' + i).on('click', function () {
    Y.one('#part' + i).remove(true);
});

そのようなものが「JavaScript: The Good Parts」の本にあったことを思い出し、それを見つけました (ページ 39):

var add_the_handlers = function (nodes) {
    var i;
    for (i = 0; i < nodes.length; i += 1) {
        nodes[i].onclick = function (i) {
            return function (e) {
                alert(e);
            };
         }(i);
     }
};

しかし、それもうまくいきません。もう一度 (21 回目) 見てみると、何か問題がありました。引数 'e' を必要とする内部関数を返しますが、'i' は内部関数に呼び出されず、外部関数にのみ呼び出されます。私はこれを「修正」し、今では YUI で動作します:

 Y.one('#btnDel' + i).on('click', function (i) {
    return function () {
        Y.one('#part' + i).remove(true);
    }
}(i));

errata パッケージに、誰かがこの「修正」も書きました。しかし、著者 (Crockford!) はまだ書籍版に固執しています。私が監督しているものはありますか?私のバージョンが私のケースで機能するのは偶然ですか?

ps:i匿名リターン関数を にバインドするとthis.i、これはグローバル オブジェクトになりますか?

pps: 私の素晴らしい英語でごめんなさい。:|

4

3 に答える 3

2

...またはイベント委任を使用します: http://yuilibrary.com/yui/docs/node/node-evt-delegation.html。

1) 必要な要素 (この場合はボタン) に委譲するイベント リスナーが 1 つだけになります。2) 動的コンテンツでより適切に機能します。後で別の要素 (ボタンなど) を追加する場合、別のリスナーをアタッチする必要はありません。すでに委任によって処理されています。

...そして、あなたが参照している例 (ページ 39) は、ほとんどの初心者にとって落とし穴である典型的な閉鎖です。心配はいりません。あなたは印象的な解決策を自分で考え出しました。

于 2013-08-09T12:19:53.177 に答える
0

iはループの外側で定義されていますが、クリックが発生するまでサブスクライバー関数で評価されないためです。同じiが、node.lengthと等しくなるまでインクリメントされました。したがって、クリックが発生すると、iはnode.lengthになります。これは、JavaScriptを初めて使用する開発者によくあるエラーです。何が起こっているかの詳細については、 http：//james.padolsey.com/javascript/closures-in-javascript/を参照してください。

解決策については、イベント委任を使用してください：http: //yuilibrary.com/yui/docs/event/delegation.html

于 2012-05-03T23:48:45.280 に答える
0

クラスセレクターですべてのボタンを集めてみてください。次に、単に「each」関数を使用できます。

Y.all(".buttonClassName").each(function (oneButtonNode) {
    oneButtonNode.on("click", function (event) {
        //do something
        alert(this.get("id"));
    })
});

YUI3 ドキュメント: http://yuilibrary.com/yui/docs/node/#nodelist

于 2012-04-29T18:13:45.990 に答える