jqueryプラグインイベントで$ thisにアクセス

Question

jQueryプラグインを作成していて、イベントをwindow.scrollにバインドする必要があります。 window.scroll内で実行されるアクションは、元の初期化が呼び出されたときに渡された設定によって異なります。

バインドされたイベント内でデータ要素、またはこれにアクセスするにはどうすればよいですか？

(function($) { 
    var methods = { 
     init : function(options) { 
      return this.each(function() { 
       $(window).bind("scroll.myPlugin", methods.windowOnScroll); 
      }); 
     }, 
     windowOnScroll : function() { 
      var $this = $(this); 
      var data = $this.data("scrollingLoader"); 
      if (data.something) { 
       // ... 
      } 
     } 
    })(jQuery); 

Answer 1

jQueryのは、クロスブラウザ機能を結合し便利な機能、$.proxyを提供します。

(function($) { 
    var methods = { 
     init : function(options) { 
      return this.each(function() { 
       $(window).bind("scroll.myPlugin", $.proxy(methods.windowOnScroll,methods)); 
      }); 
     }, 
     windowOnScroll : function() { 
      var $this = $(this); 
      var data = $this.data("scrollingLoader"); 
      if (data.something) { 
       // ... 
      } 
     } 
    })(jQuery); 

$ .proxy関数は、第2引数のコンテキストで最初の引数で渡された関数を常に実行する関数を返します。 http://api.jquery.com/jQuery.proxy

Answer 2

はあなたのスコープを定義する必要があります。

(function($) { 
    var methods = { 
     init : function(options) { 
      return this.each(function() { 
       var scope = this; 
       $(window).bind("scroll.myPlugin", function(){ 
        methods.windowOnScroll.call(scope); 
       }); 
      }); 
     }, 
     windowOnScroll : function() { 
      var $this = $(this); 
      var data = $this.data("scrollingLoader"); 
      if (data.something) { 
       // ... 
      } 
     } 
    })(jQuery);