如何用JavaScript编写倒计时程序？

只是想问一下如何创建最简单的倒计时计时器

网站上会有这样一句话：

“注册将在05:00分钟后结束！”

所以，我想做的是创建一个简单的js倒计时计时器，从“05:00”到“00:00”，然后在结束后重置为“05:00”

---

我之前已经看过了一些答案，但是对于我想要做的事情来说，它们似乎都太过激烈了（日期对象等）。

您可以使用setInterval轻松创建计时器功能。下面是您可以使用它创建计时器的代码

window.onload=function（）{
var分钟=5；
var-sec=60；
setInterval（函数（）{
document.getElementById（“计时器”）.innerHTML=minute+“：”+sec；
第二节；
如果（秒==00）{
分钟--；
秒=60；
如果（分钟==0）{
分钟=5；
}
}
}, 1000);
}

---

注册将在05:00分钟后结束您可以使用setInterval轻松创建计时器功能。下面是您可以使用它创建计时器的代码



window.onload=function（）{
var分钟=5；
var-sec=60；
setInterval（函数（）{
document.getElementById（“计时器”）.innerHTML=minute+“：”+sec；
第二节；
如果（秒==00）{
分钟--；
秒=60；
如果（分钟==0）{
分钟=5；
}
}
}, 1000);
}
注册将在05:00分钟后结束我有两个演示，一个带有
jQuery
，一个没有。这两个函数都不使用日期函数，而且都非常简单



功能启动定时器（持续时间，显示）{
var定时器=持续时间，分钟，秒；
setInterval（函数（）{
分钟=parseInt（计时器/60,10）；
秒=parseInt（计时器%60,10）；
分钟=分钟<10？“0”+分钟：分钟；
秒=秒<10？“0”+秒：秒；
display.textContent=分钟+“：”+秒；
如果（--定时器<0）{
定时器=持续时间；
}
}, 1000);
}
window.onload=函数（）{
变量五分钟=60*5，
display=document.querySelector（“#time”）；
startTimer（五分钟，显示）；
};

注册在05:00分钟后结束！
我有两个演示，一个带有
jQuery
，一个没有。这两个函数都不使用日期函数，而且都非常简单



功能启动定时器（持续时间，显示）{
var定时器=持续时间，分钟，秒；
setInterval（函数（）{
分钟=parseInt（计时器/60,10）；
秒=parseInt（计时器%60,10）；
分钟=分钟<10？“0”+分钟：分钟；
秒=秒<10？“0”+秒：秒；
display.textContent=分钟+“：”+秒；
如果（--定时器<0）{
定时器=持续时间；
}
}, 1000);
}
window.onload=函数（）{
变量五分钟=60*5，
display=document.querySelector（“#time”）；
startTimer（五分钟，显示）；
};

注册在05:00分钟后结束！
如果你想要一个真正的计时器，你需要使用date对象

计算差额

格式化字符串

window.onload=function(){
      var start=Date.now(),r=document.getElementById('r');
      (function f(){
      var diff=Date.now()-start,ns=(((3e5-diff)/1e3)>>0),m=(ns/60)>>0,s=ns-m*60;
      r.textContent="Registration closes in "+m+':'+((''+s).length>1?'':'0')+s;
      if(diff>3e5){
         start=Date.now()
      }
      setTimeout(f,1e3);
      })();
}

示例

不太精确的计时器

var time=5*60,r=document.getElementById('r'),tmp=time;

setInterval(function(){
    var c=tmp--,m=(c/60)>>0,s=(c-m*60)+'';
    r.textContent='Registration closes in '+m+':'+(s.length>1?'':'0')+s
    tmp!=0||(tmp=time);
},1000);

如果你想要一个真正的计时器，你需要使用date对象

计算差额

格式化字符串

window.onload=function(){
      var start=Date.now(),r=document.getElementById('r');
      (function f(){
      var diff=Date.now()-start,ns=(((3e5-diff)/1e3)>>0),m=(ns/60)>>0,s=ns-m*60;
      r.textContent="Registration closes in "+m+':'+((''+s).length>1?'':'0')+s;
      if(diff>3e5){
         start=Date.now()
      }
      setTimeout(f,1e3);
      })();
}

示例

不太精确的计时器

var time=5*60,r=document.getElementById('r'),tmp=time;

setInterval(function(){
    var c=tmp--,m=(c/60)>>0,s=(c-m*60)+'';
    r.textContent='Registration closes in '+m+':'+(s.length>1?'':'0')+s
    tmp!=0||(tmp=time);
},1000);

再一次，您忽略了相关的HTML，尽管这次您至少解释了复杂性问题。但说真的，你需要自己寻找解决方案，然后过来问我们你遇到的问题。用代码示例抱怨它们是多么的复杂？无论如何，我认为您可以轻松地
setInterval
并使其基于.innerHTML，而不是基于日期。是的，人们应该自己寻找解决方案。但是使用javaScript有很多执行常见任务的例子。我知道如何做倒计时，但我更喜欢在网上找到倒计时（比如组件）。多亏了这个问题和广泛的答案，我找到了我想要的。倒计时逻辑我发现这些解决方案更简单：看这个：再次，你忽略了相关的HTML，尽管至少这次你已经解释了复杂性问题。但说真的，你需要自己寻找解决方案，然后过来问我们你遇到的问题。用代码示例抱怨它们是多么的复杂？无论如何，我认为您可以轻松地
setInterval
并使其基于.innerHTML，而不是基于日期。是的，人们应该自己寻找解决方案。但是使用javaScript有很多执行常见任务的例子。我知道如何做倒计时，但我更喜欢在网上找到倒计时（比如组件）。多亏了这个问题和广泛的答案，我找到了我想要的。倒计时逻辑我发现这些解决方案更简单：看这个：你就是那个人！这正是我想要的。非常感谢。还有一件事：如何在分钟前添加“0”，使其显示“04:59”，而不是“4:59”？
minutes=minutes<10？“0”+分钟：分钟
@timbram起初我也觉得很奇怪，直到我意识到
var
声明后面的逗号分隔了不同的声明。因此，
minutes
和
seconds
只是声明（但未初始化）变量。因此，
timer
只是简单地等于
duration
参数，不多不少。@SinanErdem我写了一些代码来实现这一点。我可以在今天晚些时候将该代码添加到答案中。完成后，我将ping您。如何添加重置选项？还有暂停和恢复？我尝试添加一个字段this.reset，并在闭包中检查它。但是时钟一直在走，你就是那个人！那正是