html5在线天数计时器,HTML倒计时效果：天、时、分、秒 | 固定时间倒计时

需求分析：

希望制作一个固定时间倒计时效果，比如某某活动在4小时之后结束，点开网页，触发倒计时事件，开始4小时倒计时。考虑使用setInterval定时器，在时间为0后，clearInterval清除定时器。

代码实例：

写一个span用于显示，记得引用jQuery

HTML：

JS：

$(function(){

var timeInt = setInterval(function(){leftTimer();},1000); //开始倒计时

/*倒计时，可设定leftTime毫秒数为剩余时间*/

var leftTime = 14400000;//剩余的毫秒数

function leftTimer(){

if(leftTime == 0){

clearInterval(timeInt);

/*此处可写倒计时结束后的动作*/

}else{

var days = parseInt(leftTime / 1000 / 60 / 60 / 24 , 10); //计算剩余的天数

var hours = parseInt(leftTime / 1000 / 60 / 60 % 24 , 10); //计算剩余的小时

var minutes = parseInt(leftTime / 1000 / 60 % 60, 10);//计算剩余的分钟

var seconds = parseInt(leftTime / 1000 % 60, 10);//计算剩余的秒数

days = checkTime(days);

hours = checkTime(hours);

minutes = checkTime(minutes);

seconds = checkTime(seconds);

$("#timer").html(days+"天" + hours+"时" + minutes+"分"+seconds+"秒");

leftTime = leftTime - 1000;

}

}

function checkTime(i){ //将0-9的数字前面加上0，例1变为01

if(i<10)

{

i = "0" + i;

}

return i;

}

});

效果：

参考：http://www.jb51.net/article/97501.htm

感谢！