如何在 jQuery 點選處理程序和 ES6 箭頭函數中正確使用 `$(this)`？

jQuery $(this) 和ES6 箭頭函數

雖然ES6 箭頭函數提供詞法綁定，但與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中文網其他相關文章！