-
2022-02-22 14:42:06
JS倒计时
dtBegin 格式为 2022-02-23 08:00:00
countDown(){ let _this = this; var curTime = Date.parse(new Date());;//获取了当前毫秒的时间戳 var str1 = Date.parse(new Date(dtBegin)); //开始时间 //时间差 var leftTime = str1 - curTime; //定义变量 d,h,m,s保存倒计时的时间 var d,h,m,s; if (leftTime >= 0) { d = Math.floor(leftTime/1000/60/60/24); h = Math.floor(leftTime/1000/60/60%24); m = Math.floor(leftTime/1000/60%60); s = Math.floor(leftTime/1000%60); }else{ clearInterval(_this.times) this.times = null; return } this.time["d"] = d+'天'; this.time["h"] = h+'时'; this.time["m"] = m+'分'; this.time["s"] = s+'秒'; clearInterval(_this.times) this.times=setInterval(()=>{ _this.countDown() },1000) },
更多相关内容 -
JS倒计时_javascript倒计时
2017-02-17 11:44:55JS倒计时 -
带铃声报警音乐js倒计时
2021-06-24 13:16:00带铃声报警音乐js倒计时是一款在倒计时结束后,报警铃声自动响起特效。 -
html JavaScript js倒计时跳转页面
2019-05-24 01:46:07NULL 博文链接:https://heisetoufa.iteye.com/blog/355114 -
javascript实现倒计时(精确到秒)
2020-12-12 10:55:22代码相当简单实用,这里就不多废话了,小伙伴们简单看下就能明白 <!DOCTYPE ...<... <head>...div id="d -
javascript实现倒计时并弹窗提示特效
2020-10-24 03:54:04倒计时的功能在我们做项目的时候会经常遇到,这里给大家分享的是个人编写的一个简易的效果代码,有需要的小伙伴可以参考下 -
Javascript倒计时(定时)执行跳转事件的代码
2020-10-28 05:06:38Javascript倒计时(定时)执行跳转事件的代码,需要的朋友可以参考下 -
javascript 倒计时代码
2020-12-10 15:17:29[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] -
js 倒计时(高效率服务器时间同步)
2020-12-09 05:41:24方案1:每次倒计时去服务端请求时间 //开启定时器 var timer = setInterval(function () { //执行请求,获取当前服务端时间并进行相应操作 }, 1000); 这个方案对于稍微有点经验的开发人员来说,都知道是不可取的。... -
简单实现JS倒计时效果
2020-11-27 17:21:43本文实例为大家分享了JS倒计时效果的具体代码,供大家参考,具体内容如下 Index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>倒计时</title> ... -
简单实用的js倒计时 时分秒倒计时
2018-07-05 19:25:08js时分秒倒计时,某教育网站线上使用的同款js倒计时。 -
js实现倒计时时分秒
2019-03-29 17:15:17js实现倒计时的例子 -
详解JS实现简单的时分秒倒计时代码
2020-12-09 14:58:44本文实例为大家分享了JS时分秒倒计时的实现的具体代码,供大家参考,具体内容如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js简单时分秒倒计时<... -
Javascript倒计时代码
2020-10-28 23:16:10JS脚本是在网上找到的,然后进行了改进,弥补了不足之处。 -
js实现倒计时关键代码
2020-12-12 15:58:44我们经常会在一些电商网站上看到秒杀倒计时,双11倒计时.其实倒计时的效果实现起来也是很简单的,并不复杂. 首先呢,开始写之前一定要理清楚思路,思路清晰了,那写起来就容易多了,下面我分了几个步骤: 1.获取当前的时间,... -
javascript实现数字倒计时特效
2020-11-23 05:46:26本文实例讲述了JS实现的网页倒计时数字时钟效果,分享给大家供大家参考,具体实现方法如下: 效果图: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> ... -
js倒计时显示实例
2020-10-20 21:55:26本文分享了js倒计时显示的实例,需要的朋友可以参考借鉴,下面就跟小编一起来看看吧 -
原生js实现倒计时功能 图片
2019-02-14 16:14:23日常开发中,电商经常使用到抢购,不过当抢购的时候会用到倒计时 -
js倒计时小程序
2020-10-26 18:14:01js倒计时代码,可以精确到天和精确到秒 -
js倒计时简单实现代码
2020-12-28 19:41:48倒计时: 1.设置一个有效的结束日期 2.计算剩余时间 3.将时间转换成可用的格式 4.输出时钟数据作为一个可重用的对象 5.在页面上显示时钟,并在它到达0时停止 html <span id=days></span>天 ... -
js防刷新的倒计时代码 js倒计时代码
2020-10-19 06:46:44主要为大家详细介绍了js防刷新的倒计时代码,js倒计时的实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 -
Javascript 倒计时源代码.(时.分.秒) 详细注释版
2020-10-28 14:08:17基于js的倒计时实现代码,并有详细的注释比较适合学习使用。 -
JS实现倒计时图文效果
2020-10-17 17:39:35主要为大家详细介绍了JS实现倒计时图文效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 -
JS倒计时类
2018-09-13 08:28:59* 倒计时类使用方式 hbj ************************************************** * 多个倒计时 * * new countdown().init('end_time',1); * * 第一个参数 id * * 第二个参数 * * 不填写 内容正数则加 负数则减 ... -
最全面的JS倒计时代码
2021-01-19 15:39:32第一种:精确到秒的javascript倒计时代码 HTML代码: <form name=form1> 离2010年还有: <input type=textarea name=left size=35 style=text-align: center> </form> [removed] ... -
js倒计时算法
2022-06-01 19:43:40目录一、Data对象二、时间戳三、封装倒计时函数 Data对象是js的内置对象,它本质上是一个构造函数,表示时间这一大类,包括年月日时分秒等。起始时间:1970年1月1日。Date对象包括的方法: 作用:获取Date对象距离...目录
一、Data对象
Data对象是js的内置对象,它本质上是一个构造函数,表示时间这一大类,包括年月日时分秒等。起始时间:1970年1月1日。
调用方法:var date = new Date();
//无参数时,返回系统时间;参数格式:‘2022-6-1 20:00:00’
Date对象包括的方法:
二、时间戳
作用:获取Date对象距离1970年1月1日的总毫秒数。
获取方法:
方法1、 var date = new Date(); date.valueOf(); 方法2、 var date = new Date(); date.getTime(); 方法3、 var otherTime = +new Date(); 方法4、 Date.now();
结果:
三、封装倒计时函数
原理:输入时间的毫秒数 - 当下时间的毫秒数 = 剩余时间的毫秒数 1s = 1000ms
将剩余时间的毫秒数转为 时+分+秒 的格式
function countDown(time) { var nowTime = +new Date(); var inputTime = +new Date(time); // 得到秒数 var remain = (inputTime - nowTime) / 1000; var day = parseInt(remain / 60 / 60 / 24); var h = parseInt(remain / 60 / 60 % 24); h = h < 10 ? '0' + h : h; var m = parseInt(remain / 60 % 60); m = m < 10 ? '0' + m : m; var s = parseInt(remain % 60); s = s < 10 ? '0' + s : s; return day + '天 ' + h + ':' + m + ':' + s; } console.log(countDown('2022-6-1 21:00:00'));
结果:
注意:函数封装的参数应给Date对象,才能获得完整的时间戳。
-
JS实现发送短信验证后按钮倒计时功能(防止刷新倒计时失效)
2020-12-02 01:07:06应用场景 在开发“发送短信验证”功能时候,要解决一个问题,...发送成功后把剩余倒计时存储到cookie,当页面刷新时,检查cookie 是否还存储着剩余倒计时?,如果有,发送按钮则保持倒计时状态,不可点击,否则发送按钮 -
js实现倒计时器自定义时间和暂停
2020-12-12 00:48:02js倒计时器可自定义时间和暂停,效果如下,点击start 开始计时,end结束计时 分别复制 H5 css js 代码即可实现,具体的算法在js控制函数中(都写了注释) css html,body{ width:100%;height:100%; } .content{ ... -
JS倒计时两种实现方式代码实例
2020-10-15 01:38:09主要介绍了JS倒计时两种实现方式代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 -
JavaScript倒计时制作
2022-04-02 22:33:34代码如下: <script> function countDown(time) { var nTime = +new Date(time) - +new Date(); // 用户输入的时间 - 当前的时间;... var times = nTime / 1000;... var t = parseInt((times / 60 / 60 / 24))...代码如下:
<script>
function countDown(time) {
var nTime = +new Date(time) - +new Date(); // 用户输入的时间 - 当前的时间;
var times = nTime / 1000; //相隔时间化为秒
var t = parseInt((times / 60 / 60 / 24)); //天
t = t < 10 ? '0' + t : t;
var h = parseInt((times / 60 / 60 % 24)); // 时
h = h < 10 ? '0' + h : h;
var m = parseInt((times / 60 % 60)); // 分
m = m < 10 ? '0' + m : m;
var s = parseInt((times % 60)); // 秒
s = s < 10 ? '0' + s : s;
return t + '天' + h + '时' + m + '分' + s + '秒';
}
console.log(countDown('2022-4-3 15:37:12'));
var date = new Date();
console.log(date);
</script>