2

私はここにいくつかのコードを持っています:

App.prototype.binds = function(){
    var that = this;
    $('.postlist li').live('click', function(){ that.selectPost(this);} );
}

App.prototype.selectPost = function(){
    this.function();
}

binds関数で「this」の参照を「that」として作成しているので、selectPost()で、リスト項目の代わりに「this」を使用してAppオブジェクトを参照できます。

「それ」を使用する代わりに、これに対するより優雅で標準的な解決策はありますか?


Answerを使用すると、私のコードは次のようになります。

App.prototype.binds = function(){
    $('.postlist li').live('click', $.proxy(this.selectPost, this) );
}

App.prototype.selectPost = function(e){
    this.function(); // function in App

    var itemClicked = e.currentTarget; //or
    var $itemClicked = $(e.currentTarget); 
}
4

1 に答える 1

5

関数はコンストラクターでバインドすることも、時間内にバインドすることもできます。

コンストラクター内

function App() {
    this.selectPost = this.selectPost.bind( this );
                   //$.proxy( this.selectPost, this ) in jQuery
}

App.prototype.binds = function(){
    $('.postlist li').live('click', this.selectPost ); //Already bound in constructor
}

ちょうど間に合うように:

App.prototype.binds = function(){
    $('.postlist li').live('click', this.selectPost.bind( this ));
                                    //$.proxy( this.selectPost, this ) in jQuery
}

.bind新しいブラウザでのみサポートされていることに注意してください。jQueryでは$.proxyそれを優先する必要があります。

http://bugs.jquery.com/ticket/12031で受け入れられたjQueryで機能リクエストを開きました。jQueryイベントを使用するときにこれが簡単になります。

jQueryイベントハンドラーではe.target通常と同じになるという一般的な誤解があることに注意してください。this実はe.currentTargetです。これでthis、要素ではなくインスタンスを参照するようになったので、を介して要素を取得できますe.currentTarget

于 2012-11-19T11:24:05.197 に答える