5

thisイベントハンドリング関数でイベントを受け取る要素に変更されるという値を持つことは非常に便利であることを知っています。ただし、要素コンテキストではなく、常にアプリケーション コンテキストで関数が呼び出されるようにしたいと考えています。setTimeoutこのようにして、それらをイベント ハンドラーとして使用したり、呼び出しなどの他の方法で使用したりできます。

したがって、次のようなコード：

window.app = (function () {
    var that = {
        millerTime: function () {},
        changeEl: function (el) {
            el = el || this;
            // rest of code...
            that.millerTime();
        }
    };
    return that;
}());

次のようになります。

window.app = (function () {
    return {
        millerTime: function () {},
        changeEl: function (el) {
            // rest of code...
            this.millerTime();
        }
    };
}());

最初の方法は、私には混乱しているように見えます。イベントを受け取る要素を最初の引数 (できれば jQuery でラップされた要素) としてイベント処理関数に渡し、コンテキスト内で呼び出す簡単な方法はありますappか? jQuery を使用して一連のイベント ハンドラーをバインドするとします。匿名関数を常に含める必要はありません。

$('body').on('click', function (event) {
    app.changeEl.call(app, $(this), event);  // would be nice to get event too
});

これをすべて処理してくれる単一の関数が必要です。この時点で、匿名関数を渡すことはできないように感じますが、誰かが解決策を持っているかどうかを知りたいだけです。

私の試み：

function overrideContext (event, fn) {
   if (!(this instanceof HTMLElement) ||
         typeof event === 'undefined'
   ) {
       return overrideContext;
   }

   // at this point we know jQuery called this function // ??
   var el = $(this);

   fn.call(app, el, event);
}

$('body').on('click', overrideContext(undefined, app.changeEl));

編集：（Function.prototype.bind私は初めてです）を 使用しても、まだ要素を取得できません：

window.app = (function () {
    return {
         millerTime: function () {},
         changeEl: function (el) {
            // rest of code...
            console.log(this); // app
            this.millerTime();
         }
    };
}());

function overrideContext (evt, fn) {
    var el = $(this); // $(Window)
    console.log(arguments); // [undefined, app.changeEl, p.Event] 
    fn.call(app, el, event);
}

$('body').on('click', overrideContext.bind(null, undefined, app.changeEl));

$('body').on('click', overrideContext.bind(app.changeEl));代わりに使用すると、関数をthis指し、引数の長さは 1 で、 のみが含まれます。どちらのインスタンスでもまだ要素を取得できません。app.changeElp.Event

4

2 に答える 2

3

使用できますFunction.prototype.bind。

$('body').on('click', overrideContext.bind(null, undefined, app.changeEl));

elementメソッドのコンテキストとして実際に渡すこともできます

$('body').on('click', overrideContext.bind(app.changeEl));
于 2012-12-30T00:38:35.627 に答える
0

あなたの間違いは、どの引数がイベント ハンドラーに渡されるかを制御しようとしていると思います。本当にそれが必要な場合は、jQuery のように独自のイベント処理ユーティリティを作成し、ハンドラーを手動で呼び出して、必要なものをパラメーターとして渡す必要があります。

でも、本当にそれが必要ですか？addEventListenerに添付された通常のハンドラー、または jQuery で利用可能なさまざまなメソッドのいずれかに添付されたハンドラーに依存している場合は、常にevent最初のパラメーターとしてオブジェクトを取得します。そして、イベントをトリガーした要素は常に で利用可能になりますevent.target。

それを考慮すると、Function.prototype.bindjAndy が提案したように、this必要な値に設定するだけで使用できます。

于 2013-01-04T16:51:53.420 に答える