如何使用for循环删除多个事件侦听器？

Question

我正在创建一个国际象棋程序来测试我的javascript能力。它没有任何AI，只计算在任何给定时间可以执行的移动，允许玩家执行移动，以及更改转弯。

这是一个JSFiddle与当前的程序：https://jsfiddle.net/1xe7ca00/

游戏机制如下：

1）firstEventListener在所有有资格移动的部分上放置一个事件监听器：

divChessboardContainer.addEventListener("click", firstEventListener, true);

2）用户点击符合条件的作品。如果需要，他们可以点击多个部分。

3）程序从event.target（removeAddClassesReturnPieceData）收集数据，检查已经选择了哪一块并确定该块可以执行哪些移动（ifWhitePawn，ifBlackKnight等），并以绿色突出显示建议的移动（generateObjectForSecondEventListener）。

4）以绿色突出显示的每个建议移动都有一个事件监听器：

proposedPositionElement.addEventListener("click", movePieces.bind( null, objectForSecondEventListener, proposedPositionElement ), false);

5）用户单击建议的移动并执行移动（movePieces）。目前它只是交换所选部分的IMG标签和建议的位置。

6）我遇到的问题是我想从每个回合末尾以绿色突出显示的所有方块中删除第二个事件监听器，但我似乎无法将其删除。我已经研究过removeEventListener（）方法，我知道语法必须非常具体才能正常工作，但我无法弄清楚我做错了什么。这是我创建的for循环，试图删除事件监听器（不起作用）：

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

    let proposedPositionElement = allListTags[i];

    console.log(proposedPositionElement);

    proposedPositionElement.removeEventListener("click", movePieces, false);

}

谁能帮我吗？

Answer 1

在步骤4中，将事件绑定到movePieces.bind（...），并在步骤6中，尝试删除movePieces侦听器。这些是不同的功能。此外，尝试删除movePieces.bind（...）也无法正常工作，因为这将创建第三个函数。您需要在步骤4中的某处存储绑定的函数引用，并在步骤5中检索它。