使用 arrow function 作为回调函数，而不是使用this来获取处理程序所绑定的元素，您应该使用event.currentTarget。
箭头函数中this的值由箭头函数 * 定义 * 的位置决定，而不是 * 使用 * 的位置。
因此，从现在开始，请记住event.currentTarget始终引用当前正在处理其EventListener的DOM**元素。

.currentTarget对.target

使用event.currentTarget而不是event.target，因为 * 事件冒泡/捕获 *：

• event.currentTarget-是事件监听器所连接的元素。
• event.target-是触发事件的元素。
  From the documentation:

currentTarget类型EventTarget，readonly用于指示当前正在处理其EventListeners的EventTarget。这在 * 捕获 * 和 * 冒泡 * 期间特别有用。

检查下面片段中的基本示例

var parent = document.getElementById('parent');
parent.addEventListener('click', function(e) {
  
  document.getElementById('msg').innerHTML = "this: " + this.id +
    "<br> currentTarget: " + e.currentTarget.id +
    "<br>target: " + e.target.id;
});

$('#parent').on('click', function(e) {

  $('#jQmsg').html("*jQuery<br>this: " + $(this).prop('id')
                   + "<br>currenTarget: " + $(e.currentTarget).prop('id') 
                   + "<br>target: " + $(e.target).prop('id'));
});

$('#parent').on('click', e => $('#arrmsg').html('*Arrow function <br> currentTarget: ' + e.currentTarget.id));

#parent {background-color:red; width:250px; height:220px;}
#child {background-color:yellow;height:120px;width:120px;margin:0 auto;}
#grand-child {background-color:blue;height:50px;width:50px;margin:0 auto;}
#msg, #jQmsg, #arrmsg {font-size:16px;font-weight:600;background-color:#eee;font-family:sans-serif;color:navy;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

  <div id="parent">Parent-(attached event handler)<br><br>
    <div id="child"> Child<br><br>
      <p id="grand-child">Grand Child</p>
    </div>
  </div>
 
  <div id="msg"></div><br>
  <div id="jQmsg"></div><br>
  <div id="arrmsg"></div>

你不会的
改变this的值是使用箭头函数的主要要点。
如果你不想这样做，那么箭头功能是错误的工具。

即使在箭头函数中，你也可以使用$(event.target)来代替$(this)。箭头函数保留了它们定义的作用域this。在你的例子中，它是undefined。

箭头函数和这个选择器？
箭头函数从封闭上下文中保留this。

obj.method = function(){
    console.log(this);
    $('a').click(e=>{
            console.log(this);
    })
};
obj.method(); // logs obj
$('a').click(); // logs obj

字符串
那么，如果我在回调函数中使用箭头函数，我该怎么做呢？
你已经可以访问事件目标了，你可以使用类似$(e.target)的东西，但是要小心冒泡。所以我推荐使用普通函数作为回调函数。

与常规函数相比，箭头函数对this的处理也有所不同。
总之，有了箭头函数，就没有了这个绑定。
在常规函数中，this关键字表示调用函数的对象，它可以是窗口、文档、按钮或其他任何对象。
在箭头函数中，this关键字始终表示定义箭头函数的对象。
要获取名为箭头函数的对象，必须使用event.currentTarget而不是this。
在本例中，将event定义为参数e。