需求:
要求实现 给定时间 距离超过24小时 的 剩余时间 ——使用倒计时展示
效果:
代码:
不想打字, 凑合着点看
/**
* 计时器
* @param time 初始时间 单位秒
* @param dom 元素
*/
function Timer (time, dom) {
this.time = time;
this.dom = dom;
this.reTime();
}
/**
* 刷新时间
*/
Timer.prototype.reTime = function () {
if (this.time > 0) {
this.time--
} else {
// 等于零结束计时
this.outputTime('00:00:00')
return
}
// 获取时分秒
let h = parseInt(this.time/3600)
let m = parseInt((this.time - h*3600) / 60)
let s = this.time - h*3600 - m*60
// 格式化
h < 10 ? h = `0${h}` : ''
m < 10 ? m = `0${m}` : ''
s < 10 ? s = `0${s}` : ''
// 修改元素值
this.dom.innerHTML = `${h}:${m}:${s}`;
// 递归
setTimeout(this.reTime.bind(this), 1000)
}
调用
$(".time").each((i,v)=>{
let time = $(v).attr("time"); //获取下单时间 "2019-05-27T21:16:31.000+0000"
time = time.replace(new RegExp("-","gm"),"/"); // "2019/05/27T21:16:31.000+0000"
time = time.replace("T"," ").split(".")[0]; // "2019/05/27 21:16:31"
time = new Date().getTime() - (new Date(time)).getTime(); //当前时间毫秒数减去下单时间毫秒数 得到差值
time = new Date(16*60*60*1000).getTime() - time; // 16小时的格林时间毫秒数 减去 差值毫秒数 = 剩余毫秒数
var date = new Date(time); //转换为时间对象
//将时间 换算为秒
time = (Number(date.getHours() * 3600) + Number(date.getMinutes() * 60) + Number(date.getSeconds()));
new Timer(time,v); //创建计时器对象
});
参考:https://blog.csdn.net/qq_41418386/article/details/80697276