我的函数 Game Over 的错误代码 JS

Question

我在做游戏，遇到了问题。当我点击锤子时，游戏必须显示 "Game Over"。但是，当出现锤子时，我没有点击它所在的案例，后来我再次点击同一个案例，仍然显示 "Game Over"。

var temps = 50;
var compte = temps;
var pointCounter=0;
//ONLY SELECTOR FOR DOM
var $contener = document.querySelector(".contener");
var $bestscore = document.querySelector("#bestscore");
var $compt = document.querySelector("#compt");
var $score = document.querySelector("#score");
var $button = document.querySelector('.resetBouton');


for( var i = 0; i <= 8; i++){
  $contener.innerHTML += "<div class='case case" + i + "'></div>";
}

if(localStorage.getItem('score')){
  $bestscore.textContent = 'Score : ' + localStorage.getItem('score');
}
else{
  localStorage.setItem('score', 0);
  $bestscore.textContent = 'Score : 0';
}

function decompte(){
  if(compte <= 1) {
 pluriel = "";
  } else {
 pluriel = "s";
  }
  $compt.innerHTML = compte + " seconde" + pluriel;
  if(!compte || compte < 0) {
 reset();

 if(pointCounter > localStorage.getItem('score')){
   localStorage.setItem('score', pointCounter);
   $bestscore.textContent = 'Score : ' + pointCounter;
 }
  }
  //decrease 1 point
  compte--;
}
let timer = setInterval(decompte,1000);
let taupe = setInterval(randomPosition,1000);


//RANDOM POSITION
function randomPosition() {
  var $cases = document.querySelectorAll('.case');
  // cannot click 2 times 
  for (var i =0; i< $cases.length; i++){
 $cases[i].removeEventListener('click', losePoints);
 $cases[i].removeEventListener('click', earnPoints);
 $cases[i].innerHTML = '';
  }

  var x = Math.floor(Math.random() * 9);
  var min = 1;
  var max = 7;
  var nbrRandom = min + Math.floor(Math.random() * max);

  if (nbrRandom === 2) {
 $cases[x].innerHTML = '<div id="darktaupe"><img src="images/darkTaupiqueur.png" alt="darktopiqueur"/></div>';
 $cases[x].addEventListener('click', losePoints);
  } else if(nbrRandom ===6) {
 $cases[x].innerHTML = '<div id="darktaupe"><img src="images/Marteau_TFH.png" alt="marteau"/></div>';
 $cases[x].addEventListener('click', gameOver);
  }
  else
  {
 $cases[x].innerHTML = '<div id="taupe"><img src="images/Taupiqueur.png" alt="t opiqueur"/></div>';
 $cases[x].addEventListener('click', earnPoints);
  }
}

function losePoints(event){
  /* JouerSon(); */
  pointCounter -=10;
  if(pointCounter <0){
 pointCounter =0
  }
  $score.textContent = pointCounter;
  event.currentTarget.removeEventListener('click', losePoints);
}

function earnPoints(event){
  /*    JouerSon(); */

  pointCounter ++;
  $score.textContent = pointCounter;
  event.currentTarget.removeEventListener('click', earnPoints);
}

/*function JouerSon() {
 var sound = document.getElementById("beep");
 sound.play();
} */

// RESET BUTTON
function reset(){
  $button.classList.remove("reset");
  $button.addEventListener('click', resetGame);
  clearInterval(timer);
  clearInterval(taupe);
}

function resetGame(){
  pointCounter = 0;
  compte = temps;
  $score.textContent = pointCounter;
  timer = setInterval(decompte,1000);
  taupe = setInterval(randomPosition,1000);
  $button.removeEventListener('click', resetGame);
  $button.classList.add('reset');
}
function gameOver(event){
  event.currentTarget.removeEventListener('click', gameOver);
  alert("GAME OVER");
  reset();

}

<!DOCTYPE HTML>
<html>
 <head>
  <link rel="stylesheet" type="text/css" href="styles/style.css"> 
  <meta charset="utf-8"/>
 </head>
 <body>
  <span id="compt"></span>
  <span id="score">Score : </span> <span id="bestscore"></span>
  <div class="contener"></div>
  <button class="resetBouton reset"> reset </button>
  <button class="resetBouton jouer"> Jouer </button>
  <audio id="beep" src="test1.wav">
  <script type='text/javascript' src="script/main.js"></script>
 </body>
</html>

Answer 1

通过快速检查您的游戏，您似乎每秒都在调用 randomPosition，选择一个随机元素，然后将三个事件处理程序之一附加到它。

您似乎在每次调用 randomPosition 时删除 losePoints 和 earnPoints 处理程序，但从未删除 gameOver.

我的函数 Game Over 的错误代码 JS

Error code JS with my function Game Over

javascript