javascript - 在 javascript 中显示从(00秒)开始的每个页面的计时器

Question

我使用 PHP 创建了一个测验应用程序。在该应用程序中，我每页显示一个问题。当用户单击下一个按钮时，它会显示下一个问题，从数据库中随机选择一个问题。因此我想显示时间。

但我的问题是:

我想显示一个从几秒开始的计时器。当用户单击“下一步”按钮时，第一个问题计时器将存储在数据库中，第二个问题计时器将从 00:00 开始。

我尝试了很多，但我不知道如何做到这一点。

Answer 1

最好使用 window.setInterval() 以使计时器不依赖于系统时间。 .setInterval 将每 n 毫秒触发一次。您可以使用它来增加

你可以拥有:

var secondsCounter = 0;

function quizTimer(){
secondsCounter++;
}

window.setInterval(quizTimer, 1000);

然后您可以使用轻松显示时间

myTimerElement.innerHTML = "Seconds Passed: " + secondsCounter;

现在您只需做一些调整即可使其以时间格式 MM:SS 显示

可能是

myTimerElement.innerHTML = minutesCounter + " : " + secondsCounter;

现在只需执行一些格式化方法或条件即可使计数器变量显示两位数。

编辑:

检查此片段:

var secondsCounter = 0;
var startTime;

function restartTimer(){
  secondsCounter = 0;
  window.clearInterval(startTime);
  startTime = window.setInterval(quizTimer, 1000);
}

function quizTimer(){
secondsCounter++;
document.getElementById('timer').innerHTML = "Seconds Passed: " + secondsCounter;
}


document.getElementById('btnsub').addEventListener('click', restartTimer);

<span id='timer'></span>
<button id='btnsub'>Submit</button>