endTime : number 结束的时间
    showEndTime：true / false 是否显示结束的时间
    endDom： dom 显示结束时间的html元素
    ShowDistanceEndTime：true / false 是否显示距离结束时间的时分秒倒计时
    showTime：{
    showHour：dom 需要显示距离结束时间的小时数的html元素
    showMinute：dom 需要显示距离结束时间的分钟数的html元素
    showSecond：dom 需要显示距离结束时间的秒数的html元素
    } 显示距离结束时间的时分秒的元素，以对象的形式传入

    代码如下

    1. (function () {
    2.     function CountDown(option, self) {
    3.         // 结束时间
    4.         this.endTime = Date.parse(option.endTime) ? Date.parse(option.endTime) / 1000 : false;
    5.         // 是否显示结束时间
    6.         this.showEndTime = option.showEndTime || false;
    7.         // 显示结束时间的html元素
    8.         this.endDom = option.endDom || null;
    9.         // 是否显示距离结束的时间
    10.         this.ShowDistanceEndTime = option.ShowDistanceEndTime || true;
    11.         /**
    12.          * 显示距离时间的结束的html元素
    13.          * showTime = {
    14.          * showHour: $('.timmer__unit_hour'), 显示时的元素
    15.          * showMinute: $('.timmer__unit_minute'), 显示分的元素
    16.          * showSecond: $('.timmer__unit_second'), 显示秒的元素
    17.          * }
    18.          */
    19.         this.showTime = option.showTime;
    20.         this.warp = self;
    21.         this.timer = null;
    22.         this.isEnd = false;
    23.     }
    24.     CountDown.prototype.init = function () {
    25.         this.timeDifferens()
    27.         // 判断是否显示结束时间
    28.         if(this.showEndTime){
    29.             var endtime = new Date(this.endTime * 1000);
    30.             var hours = endtime.getHours() <= 0 ? "24": endtime.getHours();
    31.             var minutes = endtime.getMinutes() <= 0 ? "00" :endtime.getMinutes()
    32.             this.endDom.text(hours+":"+minutes)
    33.         }
    34.     },
    35.     /**
    36.      * 获取距离结束的时间的时间差
    37.      */
    38.         CountDown.prototype.timeDifferens = function () {
    39.             // 判断结束时间是否有误
    40.             if (!this.endTime) { return false; }
    41.             // 判断是否结束
    42.             var nowTime = new Date().getTime() / 1000;
    43.             if (nowTime > this.endTime) {
    44.                 this.isEnd = true;
    45.                 this.rendInfo()
    46.                 return;
    47.             }
    48.             var difference = this.endTime - nowTime;
    49.             var self = this;
    50.             this.timer = setInterval(() => {
    51.                 difference--;
    52.                 if (difference < 0) {
    53.                     self.isEnd = true;
    54.                     self.rendInfo()
    55.                     clearInterval(self.timer)
    56.                 }
    58.                 self.computeTime(difference)
    59.             }, 1000);
    60.         }
    61.         /**
    62.          * 换算时间差
    63.          * @param {Number} time  时间差
    64.          */
    65.     CountDown.prototype.computeTime = function (time) {
    66.         this.hour = Math.floor(time / 3600);
    67.         this.minute = Math.floor(time % 3600 / 60);
    68.         this.second = Math.floor(time % 3600 % 60);
    69.         this.rendInfo()
    70.     }
    71.     /**
    72.      * 渲染信息
    73.      */
    74.     CountDown.prototype.rendInfo = function () {
    75.         if (this.ShowDistanceEndTime) {
    76.             if (this.isEnd) {
    77.                 $(this.showTime.showHour).text('已');
    78.                 $(this.showTime.showMinute).text('结');
    79.                 $(this.showTime.showSecond).text('束');
    80.                 return;
    81.             } else {
    82.                 if (this.hour < 10) {
    83.                     $(this.showTime.showHour).text("0" + this.hour);
    84.                 } else {
    85.                     $(this.showTime.showHour).text(this.hour);
    86.                 }
    87.                 if (this.minute < 10) {
    88.                     $(this.showTime.showMinute).text("0" + this.minute);
    89.                 } else {
    90.                     $(this.showTime.showMinute).text(this.minute);
    91.                 }
    92.                 if (this.second < 10) {
    93.                     $(this.showTime.showSecond).text("0" + this.second);
    94.                 }  else {
    95.                     $(this.showTime.showSecond).text(this.second);
    96.                 }
    98.             }
    100.         }
    102.     }
    104.     $.fn.extend({
    105.         countDown: function (option) {
    106.             var obj = new CountDown(option, this);
    107.             obj.init()
    108.         }
    109.     })
    111. })($ || jQuery)

    调用方式演示

    1. $('countdown-warp').countDown({
    2.     endTime: '2020-8-30 24:00:00',
    3.     showEndTime: true,
    4.     endDom: $('.endTime'),
    5.     ShowDistanceEndTime: true,
    6.     showTime: {
    7.         showHour: $('.timmer__unit_hour'),
    8.         showMinute: $('.timmer__unit_minute'),
    9.         showSecond: $('.timmer__unit_second'),
    10.     },
    11. })