如何在 jQuery 单击处理程序和 ES6 箭头函数中正确使用 `$(this)`？

jQuery $(this) 和 ES6 箭头函数

虽然 ES6 箭头函数提供词法 this 绑定，但与jQuery 单击绑定。在这种情况下使用箭头函数时，$(this) 的行为有所不同，本质上是模拟 ES5 闭包行为：

this._pads.on('click', () => {
  if (this.go) { $(this).addClass('active'); }
});

要解决此问题，重要的是要了解 Traceur 无法忽略 $( this) 用于此上下文中的词汇绑定。 ES6 规定了箭头函数的行为，它们本质上缺乏对词法 this 的访问。

解决方案在于使用 event.currentTarget 而不是 $(this):

this._pads.on('click', (event) => {
  if (this.go) {
    $(event.currentTarget).addClass('active');
  }
});

jQuery 提供事件.currentTarget 专门用于此目的，因为它认识到使用回调函数访问词法 this 并不总是可行。通过利用 event.currentTarget，将定位正确的元素，从而无需修改此绑定或引入对 ES5 代码的依赖。

以上是如何在 jQuery 单击处理程序和 ES6 箭头函数中正确使用 `$(this)`？的详细内容。更多信息请关注PHP中文网其他相关文章！