将其他参数传递给事件处理程序

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

_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); }); 

但后来我不能解开这个function

 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

Answer 2

 _clickHandler: function(x, y, event){ // x = 1, y = 2 event.preventDefault(); }, attachClickEv: function(element){ element.on('click', this._clickHandler.bind(1,2)); }, 

Answer 3

假设您使用支持的浏览器（ES5），您可以使用bind ie：

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

Answer 4

如.on的文档中.on ，您可以将数据传递给您的事件。

.on（events [，selector] [，data]，handler）

数据

类型：任何东西

触发事件时要在event.data中传递给处理程序的数据。

所以你的活动看起来像这样：

 _clickHandler: function(event){ var myObj = event.data.object; // [myObj] will be your plugin // [this] will be the clicked element // [event] will be you event }, attachClickEv: function(element){ ...... element.on('click', {object : this}, this._clickHandler); },