JQuery UI：ハンドラをメソッドにバインドする：要素を取得できませんか？

Question

私は要素にハンドラをバインドした少しのjQuery UIウィジェットを作成しています：

this.element.bind("keyup", { list: this.container }, this._filter); 

ウィジェットはオプションがあります。

options: 
{ 
    dataUrl: '', 
    isEnabled: true 
}, 
_filter: function (event) 
{ 
    var input = $(this); 
    var that = this; 
    alert(that.options.isEnabled); 
    if (that.options.enabled) { 
     that.container.show(); 
     event.data.list.find("li").each(function() { 
      if ($(this).text().toLowerCase().indexOf(input.val().toLowerCase()) < 0) { 
       $(this).hide(); 
      } 
      else { 
       $(this).show(); 
      } 
     }); 
    } 
}, 

しかし、ときに私は1つのオプションの警告を行います_filter、私はエラーが発生します： "that.optionsは未定義です" 私がアクセスしようとする他の要素と同じです。関数が内部で定義されているものか、渡されたeventDataからのみ取得できるかのようです。

何か不足していますか？ ありがとう

Answer 1

問題は、リスナー関数（_filter）のscope/context/thisがバインドされたjQueryオブジェクトであることです。あなたの場合、_filter関数のこれは実際にイベントリスナーとして呼び出されたときにウィジェットのthis.elementを参照します。

this.element.bind("keyup", { list: this.container }, $.proxy(this, "_filter")); 

プロキシメソッドは何、基本的には特定のコンテキスト（ see documentation）に適用される機能をラップされています。何ができることは次のとおりです。プロキシの便利な点は、このような元の関数を使用してバインドを解除できることです。

this.element.unbind("keyup", this._filter);