js 倒計時案例

需求：

    要求實現 給定時間  距離超過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