让人震惊的时间插件！

最近要实现一个倒计时的功能，想着网上有那么多轮子，就想直接用，于是乎，找到了这个插件：http://www.jq22.com/yanshi5456
但是人家收费啊，但是收费又怎能难倒一名前端开发的热情呢，于是乎，我在Network中和Sources中发现了蛛丝马迹，找到了原来使用的是downcount.js，本着程序员的代码开源精神我又找到了downcount.js的源码，源码最终出来的结果如下图。

image.png

但是又不太符合项目中倒计时的样式，于是乎，改改改，改成了支持以下的样式

时间倒计时.gif

本着开源精神的继承，源码给君双手奉上。源码是压缩后的，这里我做了格式的调整；此时，必须要说一个不是bug的bug，改完代码后美滋滋的我，突然发现，倒计时居然少了两个小时！震惊！于是乎，在代码中找啊找，想找到问题出在哪，楞是没找到，最后在设置代码传参的时候，发现居然传的是东十区的时间，太专业了，还有地理位置的时间差计算，我等自愧不如啊！

//jquery.downCount.js

(function ($) {
    $.fn.downCount = function (options, callback) {
        var settings = $.extend({ date: null, offset: null }, options); 
        if (!settings.date) { $.error('Date is not defined.'); }
        if (!Date.parse(settings.date)) { $.error('Incorrect date format, it should look like this, 12/24/2012 12:00:00.'); }
        var container = this; 
        var currentDate = function () {
            var date = new Date(); 
            var utc = date.getTime() + (date.getTimezoneOffset() * 60000); 
            var new_date = new Date(utc + (3600000 * settings.offset));
            return new_date;
        }; 
        function countdown() {
            var target_date = new Date(settings.date), current_date = currentDate(); 
            var difference = target_date - current_date;
            if (difference < 0) { clearInterval(interval); if (callback && typeof callback === 'function') callback(); return; }
            var _second = 1000, _minute = _second * 60, _hour = _minute * 60, _day = _hour * 24; 
            var days = Math.floor(difference / _day), hours = Math.floor((difference % _day) / _hour)+days*24, minutes = Math.floor((difference % _hour) / _minute), seconds = Math.floor((difference % _minute) / _second); 
            days = (String(days).length >= 2) ? days : '0' + days; 
            hours = (String(hours).length >= 2) ? hours : '0' + hours; 
            minutes = (String(minutes).length >= 2) ? minutes : '0' + minutes; 
            seconds = (String(seconds).length >= 2) ? seconds : '0' + seconds;  
            container.find('.hours .hour_one').text(hours.toString().substr(0,1));
            container.find('.hours .hour_twe').text(hours.toString().substr(1,1));
            if(hours.toString().substr(2,1)!= '') container.find('.hours .hour_three').removeClass("none").text(hours.toString().substr(2,1));   
            container.find('.minutes .minutes_one').text(minutes.toString().substr(0,1));
            container.find('.minutes .minutes_twe').text(minutes.toString().substr(1,1));  
            container.find('.seconds .seconds_one').text(seconds.toString().substr(0,1));
            container.find('.seconds .seconds_twe').text(seconds.toString().substr(1,1));  
        }; 
        var interval = setInterval(countdown, 1000);
    };
})(jQuery);

调用

$('.countdown').downCount({
        date: '11/28/2019 24:00:00',
        offset: +8     // 传入地区的时间差
    }, function () {
        alert('活动已结束!');
    });

页面(类名是固定的)

               <ul class="countdown clearfix">
                    <li>
                        <span class="hours">
                            <span class="hour_one">0</span>
                            <span class="hour_twe">0</span>
                            <span class="hour_three none">0</span>
                        </span>
                    </li>
                    <li class="seperator">:</li>
                    <li>
                        <span class="minutes">
                            <span class="minutes_one">0</span>
                            <span class="minutes_twe">0</span>
                        </span>
                    </li>
                    <li class="seperator">:</li>
                    <li>
                        <span class="seconds">
                            <span class="seconds_one">0</span>
                            <span class="seconds_twe">0</span>
                        </span>
                    </li>
                </ul>