javascript - 如何在不丢失“event”属性的情况下将参数传递给事件监听器的回调函数？

我不知道如何执行此操作，我想将参数传递给回调函数“ ctrlDeleteItem”：

document.querySelector（'。container'）。addEventListener（'click'，ctrlDeleteItem）;

但是，如果这样做，我将无法访问事件属性，例如：

document.querySelector('.container').addEventListener('click', ctrlDeleteItem(item));

function ctrlDeleteItem(item, event) {
  return function() {
    console.log(item);
    console.log(event);
  }
}

如何仍将事件作为参数传递？谢谢，我找不到方法。

最佳答案

接受的答案是错误的，因为它将导致ctrlDeleteItem函数立即执行。这可以通过在console.log("test")函数中添加ctrlDeleteItem()语句来显示-您将立即获得消息。

正确的解决方案是设置一个“包装器”回调函数，该回调函数将照常接收事件，然后使包装器使用所需的参数调用实际的回调函数。如果需要，包装程序可以将event传递给实际的回调。

const item = 'foo';
document.querySelector('.container').addEventListener('click', function(evt){
  ctrlDeleteItem(evt, item);
});

function ctrlDeleteItem(evt, item) {
    console.log(evt.type, item);
    console.log(event.target.className);
}

<div class="container">container</div>