ES6 中使用 jQuery $(this) 的問題
- 2019 年 11 月 8 日
- 筆記
在老項目中開始改用 laravel-mix ES6 逐漸過渡。摸索中遇到在與 jQuery 一同使用時 箭頭函數 中 $(this) 的含義發生了變化。
遇到這個問題主要是沒有搞清楚 箭頭函數:
$('.js-bottom-btn').click(() => { let flag = $(this).date('flag'); ... });轉換為了:
$('.js-bottom-btn').click(function() { let flag = $(_this).date('flag'); ... });_this is undefined
根據 jQuery click 文檔 可以修改為:
$('.js-bottom-btn').click(event => { let flag = $(event.currentTarget).date('flag'); ... });類似的問題:
$('jquery-selector').each(() => { $(this).click(); })需要改為:
$('jquery-selector').each((index, element) => { $(element).click(); })References:

