js实现网页同时进行多个倒计时功能
本文实例为大家分享了js实现网页同时进行多个倒计时的具体代码，供大家参考，具体内容如下
创建一个时间类Timer.
每个商品的倒计时生成一个实例：vartime=newTimer();
/**
*startime应该是毫秒数
*/
varAlarm=function(startime,endtime,countFunc,endFunc){
this.time=Math.floor((endtime-startime)/1000);//时间
this.countFunc=countFunc;//计时函数
this.endFunc=endFunc;//结束函数
this.flag='t'+Date.parse(newDate());//
};
Alarm.prototype.start=function(){
varself=this;
self.flag=setInterval(function(){
if(self.time<0){
clearInterval(self.flag);
self.endFunc();
console.log('计时结束');
}else{
varminute,hour,day,second;
day=Math.floor(self.time/60/60/24)<10?'0'+Math.floor(self.time/60/60/24):Math.floor(self.time/60/60/24);
hour=Math.floor(self.time/60/60%24)<10?'0'+Math.floor(self.time/60/60%24):Math.floor(self.time/60/60%24);
minute=Math.floor(self.time/60%60)<10?'0'+Math.floor(self.time/60%60):Math.floor(self.time/60%60);
second=Math.floor(self.time%60)<10?'0'+Math.floor(self.time%60):Math.floor(self.time%60);
//倒计时执行函数
self.countFunc(second,minute,hour,day);
self.time--;
}
},1000);
}
如果调用：
vartime1=newAlarm(startime,endtime,countFunc,endFunc); time1.start(); vartime2=newAlarm(startime,endtime,countFunc,endFunc); time2.start(); ...
调用示例：
varcountTime=function(){
vareles=$('.count_time'),
len=eles.length;
for(;len>0;len--){
varele=eles.eq(len-1);
(function(ele){
startTime=newDate(ele.attr('data-start-time')).getTime(),
endTime=newDate(ele.attr('data-end-time')).getTime(),
alarm=newAlarm(startTime,endTime,function(second,minute,hour,day){//计时钟
ele.text(hour+':'+minute+':'+second);
},function(){//倒计时结束
ele.text('00:00:00');
window.location.reload();
});
alarm.start();
})(ele);
}
};
countTime();
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。