javascript - 将附加参数传递给事件处理程序？

Question

我在这样的对象中定义了函数:

_clickHandler: function(event){
  event.preventDefault();

},

attachClickEv: function(element){
  ......
  element.on('click', this._clickHandler);
},

问题是我似乎无法将“this”传递给 clickHandler功能

我知道我可以将其包装在另一个函数中，例如:

var tthis = this;
element.on('click', function(event){
  tthis._clickHandler(event, tthis);
});

但是我以后无法使用以下方法取消该函数:

element.off('click', this._clickHandler);

还有其他办法吗？

Answer 1

您可以使用绑定(bind)来实现这一点。这是一个例子:

element.on('click', this._clickHandler.bind(this));

//later in the code...

_clickHandler: function(event) {

}

由于您使用的是 jQuery，因此您也可以使用 jQuery.proxy()。更多信息请参见:http://api.jquery.com/jQuery.proxy

更新:

要访问回调中的元素，您必须使用 event.target 或 event.currentTarget 或执行以下操作(取决于您的操作正在做):

element.on('click', this._clickHandler.bind(this, element));

//later in the code...

_clickHandler: function(element, event) {

}

另一种方法是将元素设置为对象的属性，例如:this.element = $('#el')，然后在回调中使用它。

实例:http://jsbin.com/mezuberucu/1/edit?html,js,output