JavaScript移除事件监听器失效求助——石头剪刀布游戏场景

你代码里的removeEventListener无效，核心问题有两个：

• removeEventListener的第二个参数必须是当初调用addEventListener时传入的同一个函数引用，你现在传的是event对象，这完全不符合API要求。
• 你用匿名函数作为事件处理函数，匿名函数没有可被复用的引用标识，后续根本没法指定要移除的目标函数。

修正后的代码示例 #

把事件处理函数抽成命名函数，这样添加和移除时都能指向同一个函数引用：

let btns = document.querySelectorAll('button');

// 抽成可被引用的命名函数
function handleBtnClick(event) {
    const currentBtn = event.target;
    results.textContent = '';
    playRound(currentBtn.className, getComputerChoice());
    
    if (playerCount === 5) {
        currentBtn.removeEventListener('click', handleBtnClick);
        winner.textContent = `YOU WON 5 GAMES!`;
    } else if (cpuCount === 5) {
        currentBtn.removeEventListener('click', handleBtnClick);
        winner.textContent = `YOU LOSE! CPU WINS 5`;
    }
}

btns.forEach(item => {
    item.addEventListener('click', handleBtnClick);
});

额外说明 #

如果后续需要一次性移除所有按钮的事件监听器，只需要再遍历一次按钮集合，统一调用removeEventListener('click', handleBtnClick)即可——因为所有按钮绑定的都是同一个函数引用。

内容的提问来源于stack exchange，提问作者disengage