Javascript - 如何在用户获胜时停止游戏中的计时器

Question

I've been taking an online course for web development. After doing a project to create a game I decided to modify it to get some practice. One of the things I'm trying to add is a timer for a player's turn, the code for the timer I got from a question posted online. What I haven't figured out is how to stop the function once the user clicks on the correct answer:

function timer(sec){
    var timeleft = sec;
    var downloadTimer = setInterval(function(){
  if(timeleft <= 0){
    clearInterval(downloadTimer);
    document.getElementById("countdown").textContent = "Time's Up!";
  } else {
    document.getElementById("countdown").textContent = timeleft;
  }
  timeleft -= 1;
    }, 1000);
}

This function runs once the player start's his/her turn. I tried putting that code inside a While loop so that the code runs as long as the clicked answer is not equal to the correct answer but it looks like it just starts looping and the page stops responding.

I also tried setting the timeleft variable to 0 once the player gets the right answer but that doesn't work either.

Any help or ideas would be really appreciated.

Answer 1

try:

function timer(sec){ //Create a function with parameter named "sec"
    var timeleft = sec; //Make the value of the variable "timeleft" to value of parameter "sec"

    var downloadTimer = setInterval(function(){ //Create a loop and name it "downloadTimer"

  if (timeleft == 0){ //Check if the value of "timeleft" == 0

    clearInterval(downloadTimer); //The same with "break"

    document.getElementById("countdown").innerHTML = "Time's Up!"; "Displays the text: "Time's Up!"

  }

  timeleft -= 1; //The same with timeleft = timeleft - 1

document.getElementById("countdown").innerHTML = timeleft; //Display the time left

    }, 1000); //Loop every 1 second (1000ms = 1 second)
}

or try to set boolean:

var b = false; //Make a new variable
var timeleft = 0; //This too

setInterval(function() {
if (b == true) { //Check if the variable b = true

timeleft -= 1; //The same with timeleft = timeleft - 1

document.getElementById("countdown").innerHTML = "Timeleft: " + timeleft; 
//Uhh... This will show the time left
}
else { //if b == false

timeleft = 0 //Set timer value to default
}
if (timeleft == 0) { //Check if the value of variable "timeleft" == 0 

    b = false //Set boolean to false so you can stop the timer

    document.getElementById("countdown").innerHTML = "Time's Up!"; //Change the text of element with id = "countdown"
  }
    }, 1000); //This will loop the function every 1 second  (1000ms = 1 second)