JS秒表倒计时器
<html>
<body>
<span>倒计时30分钟:</span><span id="clock">00:30:00:00</span>
</body>
</heml>
<script type="text/javascript">
//秒表倒计时控制
var normalelapse = 100;
var nextelapse = normalelapse;
var counter;
var startTime;
var start1 = clock.innerText;
var finish = "00:00:00:00";
var timer = null;
// 开始运行
function run() {
counter = 0;
// 初始化开始时间
startTime = new Date().valueOf();
//alert(startTime);
// nextelapse是定时时间, 初始时为100毫秒
// 注意setInterval函数: 时间逝去nextelapse(毫秒)后, onTimer才开始执行
timer = window.setInterval("onTimer()", nextelapse);
}
// 停止运行
function stop() {
window.clearTimeout(timer);
}
window.onload = function() {
run();
}
// 倒计时函数
function onTimer()
{
if (start1 == finish)
{
window.clearInterval(timer);
return;
}
var hms = new String(start1).split(":");
var ms = new Number(hms[3]);
var s = new Number(hms[2]);
var m = new Number(hms[1]);
var h = new Number(hms[0]);
ms -= 10;
if (ms < 0)
{
ms = 90;
s -= 1;
if (s < 0)
{
s = 59;
m -= 1;
}
if (m < 0)
{
m = 59;
h -= 1;
}
}
var ms = ms < 10 ? ("0" + ms) : ms;
var ss = s < 10 ? ("0" + s) : s;
var sm = m < 10 ? ("0" + m) : m;
var sh = h < 10 ? ("0" + h) : h;
start1 = sh + ":" + sm + ":" + ss + ":" + ms;
clock.innerText = start1;
// 清除上一次的定时器
window.clearInterval(timer);
// 自校验系统时间得到时间差, 并由此得到下次所启动的新定时器的时间nextelapse
counter++;
var counterSecs = counter * 100;
var elapseSecs = new Date().valueOf() - startTime;
var diffSecs = counterSecs - elapseSecs;
nextelapse = normalelapse + diffSecs;
//diff.value = counterSecs + "-" + elapseSecs + "=" + diffSecs;
// next.value = "nextelapse = " + nextelapse;
if (nextelapse < 0) nextelapse = 0;
// 启动新的定时器
timer = window.setInterval("onTimer()", nextelapse);
}
</script>
作者:pamchen
补充:web前端 , JavaScript ,