·您现在的位置: 云翼网络 >> 文章中心 >> 网站建设 >> 网站建设开发 >> ASP.NET网站开发 >> 为年度评选活动添加倒计时功能

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

作者:佚名      ASP.NET网站开发编辑:admin      更新时间:2022-07-23
为年度评选活动添加倒计时功能

背景:前几天,老总说为年度优秀员工评选活动(活动放在公司的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,真是“书到用时方恨少啊”。