在jquery插件事件中访问$ this

时间:2011-08-31 19:56:45

标签: jquery jquery-plugins

我正在编写一个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);

2 个答案:

答案 0 :(得分:4)

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函数返回一个函数,该函数将始终执行第二个参数上下文中第一个参数传递的函数。 http://api.jquery.com/jQuery.proxy

答案 1 :(得分:0)

您需要定义范围:

(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);