如何在javascript中设置一分钟计数器

Question

在我的项目中，我有一个问题列表，每个问题有三个选项答案。

看到问题后，如果我想回答这个问题意味着点击"显示答案"按钮。当我点击按钮时，计数器开始一分钟，一分钟后显示错误。

谁来帮帮忙?

Answer 1

你可以这样写:

function gameLost() {
  alert("You lose!");
}
setTimeout(gameLost, 60000);

UPDATE:传递函数引用到setTimeout()而不是代码字符串(我真的这样写吗?O_o)

---

编辑

也显示定时器(改进版本，感谢davin too):

<button onclick="onTimer()">Clickme</button>
<div id="mycounter"></div>
<script>
i = 60;
function onTimer() {
  document.getElementById('mycounter').innerHTML = i;
  i--;
  if (i < 0) {
    alert('You lose!');
  }
  else {
    setTimeout(onTimer, 1000);
  }
}
</script>

…

Answer 2

function timedOut() {
    alert("Some error message");
}
// set a timer
setTimeout( timedOut , 60000 );

这基本上设置了一个计时器，将在60000毫秒后执行给定的函数= 60秒= 1分钟

编辑:这是一个快速，不完美的小提琴，也显示倒计时http://jsfiddle.net/HRrYG

function countdown() {
    var seconds = 60;
    function tick() {
        var counter = document.getElementById("counter");
        seconds--;
        counter.innerHTML = "0:" + (seconds < 10 ? "0" : "") + String(seconds);
        if( seconds > 0 ) {
            setTimeout(tick, 1000);
        } else {
            alert("Game over");
        }
    }
    tick();
}
// start the countdown
countdown();

Answer 3

您将需要使用settimeout函数，请查看本文。https://developer.mozilla.org/En/Window.setTimeout记住，计时器是以毫秒为单位的，所以一分钟是60000。

Answer 4

//这是创建薄荷计数器最简单的方法，也用于angular和oops

var i=60;
function coundown(){
   setInterval(() => {
  if (this.i == 0) {
    return;
  }
  console.log(this.i--);
}, 1000);
}

//这个函数可以在otp到来或表单提交等待otp倒计时时调用

angular #javascript #typescript

Answer 5

你可以尝试使用这个

或访问Demo

获取更多详细信息

以及接下来

function countdown() {
        var seconds = 59;
        function tick() {
          var counter = document.getElementById("counter");
          seconds--;
          counter.innerHTML =
            "0:" + (seconds < 10 ? "0" : "") + String(seconds);
          if (seconds > 0) {
            setTimeout(tick, 1000);
          } else {
            document.getElementById("verifiBtn").innerHTML = `
                <div class="Btn" id="ResendBtn">
                    <button type="submit">Resend</button>
                </div>
            `;
            document.getElementById("counter").innerHTML = "";
          }
        }
        tick();
      }
      countdown();

<div class="btnGroup">
        <span class="Btn" id="verifiBtn">
          <button type="submit">Verify</button>
        </span>
        <span class="timer">
          <span id="counter"></span>
        </span>
      </div>