为年度评选活动添加倒计时功能

背景:前几天,老总说为年度优秀员工评选活动(活动放在公司的OA上面,使用asp.net+MySql开发)添加一个倒计时功能,想想没什么难度,不过是计算一下年月日时分秒而已,用javascript能够简单搞定啦!

步骤:

  1、传入活动结束时间;

  2、获取当前时间;

    3、计算时间戳的差值;

      4、通过判断差值并计算出剩余的时间

分享:

            var tid;     -- 当前时间 时间间隔周期调用函数的标记
            var NowTime; -- 当前时间
            var t;       --  时间戳差值
            var EndTime = new Date($("#hidEnd").val().replace(eval("/-/gi"), '/'));  -- $("#hidEnd").val() 记录活动结束时间的隐藏域 获取的时间格式 yyyy-MM-dd HH:mm:ss 需要将'-'替换为'/'
            function getRTime() {
                NowTime = new Date();
                t = EndTime.getTime() - NowTime.getTime();
                if (t > 0) {
                    var d = Math.floor(t / 1000 / 60 / 60 / 24);  -- 计算剩余天数
                    var h = Math.floor(t / 1000 / 60 / 60 % 24);  -- 计算剩余小时数
                    var m = Math.floor(t / 1000 / 60 % 60);       -- 计算剩余分钟数
                    var s = Math.floor(t / 1000 % 60);            -- 计算剩余秒数
                    document.getElementById("rt").innerHTML = "离活动结束还有:<br/>" + d + "天" + h + "时" + m + "分" + s + "秒";   -- rt 剩余时间所在span的ID
                }
                else {
                    clearInterval(tid);                -- 活动结束 清除计算
                    //document.getElementById("rt").innerHTML = "活动结束";   
                }
            }
            tid = setInterval(getRTime, 1000);         -- 开始计算 间隔1S           

总结:看起来简单吧,不过还是经过我一番调试搜索才搞定的,因为以前我压根不知道javascript中的时间格式的限定只能用'/',而平时用的时间格式也是 yyyy-MM-dd,真是“书到用时方恨少啊”。

posted @ 2015-02-09 17:55  chenyj  阅读(399)  评论(0编辑  收藏  举报