团购以及活动倒计时简单实现

淘宝美团一些网站上面经常搞什么活动倒计时。看到了自己也玩一下吧。

实现方法都一样，无非就是后台传值过来活动结束的时间，然后减去当前的时间进行动态插入时间节点。

html：

<div class="box" end-time="1463500799" start-time="1463381269">
        距离活动结束还有<span id="time"></span>
    </div>

js动态计算结束时间

//不足两位补0
        function timeS(num) {
            return ('0' + num).slice(-2);
        }

        function FreshTime() {
            //这两个是后台返回的时间戳，为了便于测试把开始时间变成当前本地的时间
            var attr_s = $('.box').attr('start-time');
            var attr_e = $('.box').attr('end-time');

            var startTime = new Date().getTime();
            var endTime = parseInt(attr_e * 1000);
            var differTime = endTime - startTime; //两时间差
            var d = parseInt(differTime / (24 * 60 * 60 * 1000));
            var h = parseInt(differTime / (60 * 60 * 1000) % 24);
            var m = parseInt(differTime / (60 * 1000) % 60);
            var s = parseInt(differTime / 1000 % 60);

            var t_html = d + "天" + timeS(h) + "时" + timeS(m) + "分" + timeS(s) + "秒";
            $("#time").html(t_html);

            if (differTime <= 0) {
                $("#time").html('团购已结束');
                clearInterval(timer);
            }
        }
        FreshTime();
        var timer = setInterval(FreshTime, 1000);