JS倒计时功能,给定时间返回规定格式倒计时时间

 1     $(function () {
 2         if ($("#hidDate").val().length > 0) {
 3             setInterval(function () {
 4                 $("#lastdate").html(setHtml());
 5             }, 1000);
 6         }
 7     });
 8
 9     //计算剩余
10     function calcSurplus(fdate){
11             var odate = new Date(fdate);  //未来的时间
12             var day, hour, minute, second;
13             var html, cdate, surplusDate;    //拼接文本,当前时间,剩余时间
14             var year = new Date().getYear();   //当前年份
15             var february = (year % 4 == 0 && year % 100 != 0) || year % 400 == 0 ? 29 : 28; //计算二月份的天数
16             var days = new Array(31,february,31,30,31,30,31,31,90,31,30,31);
17             function result() {
18                 cdate = new Date();
19                 surplusDate = odate.getTime() - cdate.getTime();  //未来时间与当前时间相差的毫秒
20                 millisecond = surplusDate % 1000;          //总毫秒数模1000就是换算为秒后剩余的毫秒
21                 surplusDate -= millisecond;                //总毫秒减去剩余的毫秒
22                 second = (surplusDate / 1000) % 60;        //(surplusDate / 1000)减去多余的毫秒剩下的毫秒/1000,
23                 surplusDate -= second * 1000;              //则为剩余毫秒转换为秒后的数值,然后用该数值模60则为剩下的分钟
24                 minute = (surplusDate / 60000) % 60;       //后面的运算以此类推,先减去前面已经算过的毫秒值
25                 surplusDate -= minute * 60000;             //然后用当前毫秒除以当前单位的运算值,然后取模该单位的上级单位
26                 hour = (surplusDate / 3600000) % 24;
27                 surplusDate -= hour * 3600000;
28                 day = (surplusDate / 86400000) % days[cdate.getMonth()];  //一天=86400000毫秒但是天的上级单位月的天数不是固定的所以采用数组
29                 html = day + "天" + hour + "时" + minute + "分" + second + "秒";  //倘若要计算月数,年数,按照上规则向下推
30                 return html;
31             }
32             return result;
33     }
34
35     var setHtml = calcSurplus($("#hidDate").val());
时间: 2024-08-30 06:14:46

JS倒计时功能,给定时间返回规定格式倒计时时间的相关文章

JS实现为控件添加倒计时功能

一.概述 在有些报表需求中,需要为控件添加倒计时功能,限制到某一个时间点后能进行一项操作或不能进行某项操作,比如查询,导出功能等等,又需要人性化地显示还有多少时间,即倒计时功能,比如下图中我们限制这个报表在每天10点后才能查询 当倒计时结束的时候,查询功能可用 这种功能如何实现的呢 二.实现思路 主要原理是利用控件的setEnable(true)/setEnable(false)来进行设置控件的可用与不可用状态,在获取时间的过程中,需要利用到js中的获取时间,利用JS的定时器函数setInter

模块:js实现一个倒计时功能

1.给显示内容加样式 <style> #p1{font-size: large; color: red;} </style> 2.客户端页面 <div id="p1">100</div> <button onclick="px()">倒计时开始</button> <button onclick="px1()">暂停</button> 3.js处理 &l

js实现是倒计时功能

工作中经常用到倒计时的功能,最近在整理之前做的项目的时候,发现自己写过一个倒计时的功能的效果,这里和大家分享下!实现这个功能是用原生js写的,不需要加载额外的库文件!功能比较简单,但是可以在此基础上扩展程序,得到想要的效果! 这里附上效果图先: 效果比较简单,只是简单的加了下样式! 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>倒计时功能&l

js倒计时功能

<input id="countdown" type="text" value="140时50分20秒"> <script> var oCountdown = document.getElementById("countdown"), nowStamps = Date.now() - 100, // 服务器当前时间 endStamps = Date.now() + 50000 - 100, // 活动结

new Date() 倒计时功能

js中单独调用new Date() 显示的结果是:Fri May 20 2015 20:00:00 GMT+0800这种格式的时间 JS获取当前时间戳的方法 JavaScript 获取当前时间戳:第一种方法: var time =Date.parse(new Date());结果:1463732230000第二种方法: var time =(new Date()).valueOf();结果:1463732231455 第三种方法: var time=new Date().getTime():结果

jquery组件团购倒计时功能(转)

? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 <!doctype html> <html> <head>     <meta charset="utf-8">     <title&g

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

背景:前几天,老总说为年度优秀员工评选活动(活动放在公司的OA上面,使用asp.net+MySql开发)添加一个倒计时功能,想想没什么难度,不过是计算一下年月日时分秒而已,用javascript能够简单搞定啦! 步骤: 1.传入活动结束时间: 2.获取当前时间:   3.计算时间戳的差值: 4.通过判断差值并计算出剩余的时间 分享: var tid; -- 当前时间 时间间隔周期调用函数的标记 var NowTime; -- 当前时间 var t; -- 时间戳差值 var EndTime =

微信小程序——倒计时功能

做小程序项目中,需要做一个倒计时功能,如下图: 记录一下实现步骤: 1.考虑到这个功能可能会有多处用到,所以把倒计时的函数写在utils.js里面: const formatNumber = n => { n = n.toString() return n[1] ? n : '0' + n } // 倒计时 function countDown(that) { //倒计时函数 let newTime = new Date().getTime(); let endTime = that.data.

自己封装的一个简单的倒计时功能

因为平常工作中很常用到该功能,所以就利用这次国庆假期,重新梳理与对原有代码进行改善,再集成一个常用的功能,最终封装出这个“简单倒计时”功能. 该倒计时方法具有以下该功能: 1. 根据指定日期与当前的电脑时间进行匹配 2. 通过指定一个数组参数,来设置在每一天内不同的时间段进行倒计时. * 该方法还未通过实际工作的检测,稳定性未知(如果实际工作通过,会删除这段话) 1 function countDown(date,target,filter){ 2 3 var setTime = new Dat