Javascript “我有麻烦了”；使用；removeEventListener（）；

这是创建单击处理程序的原始语句

    const cells = document.querySelectorAll(".cell")
    cells.forEach(function(cell) {
      cell.addEventListener('click', onCellClicked.bind(this, cell.id));
    }) 

下面我调用

removeEventListener（）

函数，该函数包含方法

removeEventListener（）

。 无论如何，此函数不起作用，也不会产生错误消息。 有人能帮我纠正这个问题吗

if (checkForWin(oSelectionArray) === true) {
    insertWinOrLossImage('ticTacToeAssets/Assets/you win image.png', 'youWin', 'playerScore', wonOrLost = winOrLooseObj.won)
    removeEventHandlers()
  } else if (checkForWin(xSelectionArray) === true) {
    insertWinOrLossImage('ticTacToeAssets/Assets/you loose image.png', 'youLoose', 'CPUscore', wonOrLost = winOrLooseObj.lost)
    removeEventHandlers()
  } else if (oSelectionArray.length === 5) {
      insertWinOrLossImage('ticTacToeAssets/Assets/noWinner.png', 'draw', 'drawScore', wonOrLost = winOrLooseObj.draw)
      removeEventHandlers()
     }
   }

function removeEventHandlers() {
  const cellsToRemoveEventhandlers = document.querySelectorAll(".cell")
  cellsToRemoveEventhandlers.forEach(function(cell) {
    cell.removeEventListener('click', onCellClicked.bind(window));
  })
}

---

每次调用

oncellclicted.bind

，都会得到一个新绑定的

oncellclicted

，这与以前的绑定不同。这就是为什么

removeEventListener

没有要删除的内容

在您的情况下（tic-tac-toe？），与其动态地添加和删除事件侦听器，不如只绑定事件并检查事件侦听器是否应该在事件侦听器中执行任何操作

另一个选项是跟踪绑定的事件侦听器函数，但这更繁琐，不值得花时间在这里

---

（还有一个选项是将事件侦听器放在父元素上，并使用事件冒泡和事件委派。）

您需要跟踪实际的侦听器，因为

.bind

创建了一个新的函数引用

大概是这样的：

let listeners = {};
const cells = document.querySelectorAll(".cell")
cells.forEach(function(cell) {
  const listener = onCellClicked.bind(this, cell.id)
  listeners[cell.id] = listener;
  cell.addEventListener('click', listener);
}) 

function removeEventHandlers() {
    const cellsToRemoveEventhandlers = document.querySelectorAll(".cell")
    cellsToRemoveEventhandlers.forEach(function(cell) {
        const listener = listeners[cell.id];
        cell.removeEventListener('click', listener);
    })
}

---

要实际删除处理程序，您需要一个指向首先添加的函数的指针

.bind（）

将围绕函数创建一个新的包装器，因此您尝试删除的包装器不是以前添加的包装器。旁注：不妨看看委托事件——这只会将一个处理程序附加到某个容器，而不是单独添加处理程序。