3

因此,我将大部分函数和变量组织成基于对象的小模块,如下所示:

module1: {
  someVariable: false,

  someFunction: function(e) {
     do some stuff using someVariable
  },

  someFunction2: function(e) {
    do some other stuff
  }
}

我将这些函数称为各种事件期间的回调,如下所示:

$(function() {
  $('.thing').on('mouseenter', module1.someFunction);
}

现在,在 someFunction 中,我希望“this”关键字引用包含该函数的对象。相反,它指的是触发函数的事件的 DOM 元素。无论如何我可以访问,比如函数包含对象中的 someVariable 变量,而不是编写 module1.someVariable?

4

1 回答 1

4

最短的答案是试试这个:

$(function() {
  $('.thing').on('mouseenter', function(e) {
    module1.someFunction(e);
  });
}

如果直接在对象上调用该方法,则“this”值仅设置为附加该方法的对象:

module1.someFunction(); // direct invocation, 'this' will be set properly
var tempFunc = module1.someFunction;
tempFunc(); // the function was removed first.  'this' will NOT be set

在您的情况下,您正在从对象中删除方法并将其交给事件处理程序。事件处理程序不知道该对象并且不执行直接调用。

事实上,事件处理程序显式地覆盖了上下文,因为这是定义 jQuery API 的方式。如果你想要你正在谈论的行为,你必须明确地覆盖它。

使用像 underscore.js 这样的库,您还可以在将函数传递给事件处理程序时绑定该函数。

$(function() {
  $('.thing').on('mouseenter', _.bind(module1.someFunction, module1));
}

我相信 Object.bind 应该在未来得到原生支持,没有库,但你还不能依赖旧的浏览器来支持它。

于 2013-10-17T17:21:06.793 回答