Javascript 为什么不删除事件侦听器

document.getElementsByClassName（'restart'）[0]。addEventListener（'click'，init）；
var tiles=document.querySelectorAll（'.row div'）；
让bombTile=[]；
init（）；
功能clickHand（平铺、索引）{
if（bombTile.indexOf（index）！=-1）{
（平铺、索引）；
}否则{
flipMe（平铺、索引）；
}
}
函数（平铺、索引）{
tile.classList.add（'bomb'）；
bombTile.forEach（e=>{
tiles[e].classList.add（'bomb'）；
瓷砖[e]。innerHTML=''；
})
document.getElementsByClassName（'row'）[0].classList.add（'bombed'）；
}
函数flipMe（平铺、索引）{
tile.classList.add（'active'）；
tile.innerHTML=''；
tile.removeEventListener（'click'，clickHand'）；
}
函数init（）{
bombTile=[]
而（长度<10）{
var r=Math.floor（Math.random（）*80）+1；
if（bombTile.indexOf（r）==-1）bombTile.push（r）；
}
document.getElementsByClassName（'row'）[0]。classList.remove（'bombed'））
tiles.forEach（（tile，index）=>{
tile.addEventListener（'click'，clickHand.bind（this，tile，index））；
tile.className=''；
tile.innerHTML=''；
})
}

*{
填充：0；
保证金：0；
}
身体{
显示器：flex；
证明内容：中心；
弯曲方向：立柱；
背景图像：线性渐变（向右，rgba（233,9），rgba（0,0,0,8）），url（“https://images5.alphacoders.com/540/thumb-1920-540654.jpg");
背景尺寸：封面；
对齐项目：居中；
字体系列：“蒙特塞拉特”，无衬线；
最小高度：100vh；
}
.行{
宽度：540px；
显示器：flex；
柔性包装：包装；
盒影：0.2px4pRGBA（0,0,0,8）；
}
.罗{
动画：抖动0.82秒三次贝塞尔（.36、.07、.19、.97）二者；
变换：translate3d（0,0,0）；
背面可见性：隐藏；
}
h1{
边缘底部：20px；
字体大小：300；
}
.路政署{
显示器：flex；
证明内容：中心；
框大小：边框框；
对齐项目：居中；
宽度：60px；
高度：60px；
背景：rgba（200200.8）；
边框：1px实心#000；
过渡：全部。3秒轻松；
}
.行分区激活{
变换：旋转（180度）；
背景色：#000；
}
.row分区活动i{
颜色：黄色；
字体大小：30px；
}
街分区炸弹{
变换：旋转（180度）；
背景：#f00；
字体大小：20px；
}
.重新启动：链接，
.重新启动：已访问{
文字装饰：无；
文本转换：大写；
填充：10px 15px；
显示：内联块；
利润率：20px0；
边框：1px实心#fff；
颜色：白色；
过渡：全部。3秒轻松；
}
.重新启动：悬停{
边框：1px实心#fff；
背景色：白色；
颜色：黑色；
}
@关键帧抖动{
10%, 90% {
转换：translate3d（-1px，0，0）；
}
20%, 80% {
变换：translate3d（2px，0，0）；
}
30%, 50%, 70% {
变换：translate3d（-4px，0，0）；
}
40%, 60% {
变换：translate3d（4px，0，0）；
}
}

轰炸机
轰炸机

要删除事件侦听器，必须将传递给

addEventListener

的函数传递给

removeEventListener

您正试图删除

clickHand

，但您添加了一个通过调用

clickHand

上的

bind

生成的新函数

---

---

一种更简单的方法可能是更改

clickHand

，以便它检查互动程序的状态并确定是否已经单击了互动程序（如果已经单击了，则返回而不执行任何其他操作）.

原因可能是每次使用

.bind

时都在创建新函数。removeEventListener需要与addEventListener中的处理程序相同的函数

你所做的是

tile.addEventListener（'click'，clickHand.bind（this，tile，index））；

所以你不能使用

tile.removeEventListener（'click'，clickHand'）；

要正确移除它，请执行以下操作

let tileHandler=clickHand.bind（this，tile，index）
tile.addEventListener（'click'，tileHandler）；
//然后通过
tile.removeEventListener（'click'，tileHandler）；

但是有很多tile，您必须为创建的每个新处理程序保留一个记录。所以你能做的就是为比赛是否结束打上一个旗子。如果是，则防止瓷砖翻转

添加标志

let gameOver;

在你的点击功能

else if(!gameOver){
        flipMe(tile, index);
    }
}

在

bombClicked（）

函数add中

gameOver=true;

document.getElementsByClassName（'restart'）[0]。addEventListener（'click'，init）；
var tiles=document.querySelectorAll（'.row div'）；
让bombTile=[]；
让gameOver=false；
init（）；
功能clickHand（平铺、索引）{
如果（炸弹）
gameOver=true;