我无法显示计时器

时间:2019-06-21 19:27:29

标签: javascript timer

我无法完全显示倒数计时器。

我尝试过控制台记录,但是idk。我是菜鸟

var game = {
correct: 0,
incorrect: 0,
countdown: 90,

countdown: function () {
    game.countdown--;
    $("#counter-number").html(game.countdown);
    if (game.countdown === 0) {
        alert("Out of Time!");
        game.done();
        console.log(countdown)
    }
},
// Can't get counter to stay on screen
start: function () {
    timer = setInterval(game.countdown, 1000);
    $('#insidecontainer').prepend('<h2>Time Remaining: <span id="counter-number">90</span> Seconds</h2>');
    $("#start").remove();
    console.log(timer)

    for (var i = 0; i < questions.length; i++) {
        panel.append('<h2>' + questions[i].question + '</h2>');
        for (var j = 0; j < questions[i].choices.length; j++) {
            panel.append('<input type="radio" name ="question' + '-' + i + '"value="' + questions[i].choices[j] + '">' + questions[i].choices[j]);
        }
    }
    panel.append("<button id='done'>Done!</button>");
},

计时器显示为90,但1秒钟后消失。我希望计时器显示它正在倒计时,直到达到零为止。

1 个答案:

答案 0 :(得分:0)

问题缺少很多代码,但是有多种方法可以使用JS和JS库实现计时器。

遵循您的方法也许就足够了?

var game = {
  correct: 0,
  incorrect: 0,
  countdownseconds: 90,
  intervalId: null,

  countdown: function () {
    game.countdownseconds--;
    if (game.countdownseconds === 0)
      clearInterval(game.intervalId);
    $("#counter-number").html(game.countdownseconds);
  },

  start: function () {
    $('#insidecontainer').prepend('<h2>Time Remaining: <span id="counter-number">90</span> Seconds</h2>');
    game.intervalId = setInterval(game.countdown, 1000);
  }
}
game.start();

正如jimmy5312所指出的,标识符countdown发生了冲突,因此我使用countdownseconds来保持秒数。

使用这种方法,您的大多数逻辑将转到countdown函数,但我认为您仍然应该能够提取另一个函数来处理问题的业务逻辑,并在{{1 }}