如何在没有外部函数的情况下删除事件监听器

Question

真正的困境。我有一个 init 函数，它里面有很多参数，这些参数相互依赖，不能在外面删除，一个元素数组并添加到每个元素的单击事件侦听器中。此事件侦听器检查单击的元素是否是某个元素，然后从数组中的所有元素中删除单击侦听器。问题是由于 init 函数的内部参数，我必须在事件侦听器中使用 anonimus 函数，但是要删除事件侦听器，我必须在 removeEventListener 中传递相同的函数，因此它必须命名为函数并且我无法获得解决方案。

大概的逻辑：

let init = () =>{

  //some internal parameters here and logic

  for (let i = 0; i < elArr.length; i++) {

    elArr[i].addEventListener('click', event => {
        if (event.target.style.background ===
            elArr[pickedElement].style.background) {

            //Not working (can't define the param as a separate function due 
            //to params of this function can't be passed to there)
            for (let i = 0; i < elArr.length; i++)
                elArr[i].removeEventListener("click", event);

        } else {
            event.target.style.background = bgColor;
        }
    });  
}

Answer 1

除非我遗漏了什么，看起来您可以在 init 函数的inside 中声明命名函数，因此它仍然可以访问所有内部变量等。

let init = () => {
  //some internal parameters here and logic

  let bgCheckListener = event => {
    if (
      event.target.style.background ===
      elArr[pickedElement].style.background
    ) {
      elArr.forEach(el => {
        el.removeEventListener("click", bgCheckListener)
      })
    } else {
      event.target.style.background = bgColor
    }
  }

  elArr.forEach(el => {
    el.addEventListener("click", bgCheckListener)
  })
}

Answer 2

[Removed original answer as jquery is not applicable]

你可以简单地替换事件

使用

替换元素上的事件侦听器，而不是移除事件侦听器

elArr[i].onClick = function() { };