如何在html div的代码中显示javascript计时器?

问题描述

我有一个简单的计时器来计时测试,效果很好

$(document).ready(function() {
    var varTimerInMiliseconds = 3000;
    setTimeout(function(){ 
        document.getElementById("cntnt01moduleform_1").submit();
    },varTimerInMiliseconds);
});

但是,我也想向参加考试的学生展示倒计时。如何将计时器本身传递到ID为id="testTimer"的div中,如何将计时器转换为分钟和秒而不是毫秒?

解决方法

此代码可让您从5倒数到1,并打印到testTimer格中。

<div id="testTimer"></div>

JS代码

function Timer() {
  var counter = 10;
  var myTimer = setInterval(function() {
    document.getElementById("testTimer").innerHTML = counter;
    counter--;
    if (counter < 0) {
      clearInterval(myTimer);
      document.getElementById("testTimer").style.color = "red";

      // do anything then time is up. ex: submit() function
      document.getElementById("cntnt01moduleform_1").submit();
    }
  },1000);
}
Timer();

如您所见,不需要将毫秒数乘以秒。您只需每1000毫秒执行一次秒更新。 JS Feedle