JS倒计时实例_天时分秒


Posted in Javascript onAugust 22, 2017

HTML代码:

<div id="times_wrap" class="time_num">
 距离结束时间:
 <div class="time_w">
  <b id="times_d" class="time"> </b>天
  <b id="times_h" class="time"> </b>时
  <b id="times_m" class="time"> </b>分
  <b id="times_s" class="time"> </b>秒
 </div>
</div>

JavaScript代码:

<script type="text/javascript">
setTimeout("show_time()",1000);
var time_wrap = document.getElementByIdx_x("times_wrap");
var time_d = document.getElementByIdx_x("times_d");
var time_h = document.getElementByIdx_x("times_h");
var time_m = document.getElementByIdx_x("times_m");
var time_s = document.getElementByIdx_x("times_s");

var time_end = new Date("2012/10/29 08:00:00"); // 设定结束时间
time_end = time_end.getTime();

function show_time(){
 var time_now = new Date(); // 获取当前时间
  time_now = time_now.getTime();
 var time_distance = time_end - time_now; // 结束时间减去当前时间
 var int_day, int_hour, int_minute, int_second;
 if(time_distance >= 0){
  // 天时分秒换算
  int_day = Math.floor(time_distance/86400000)
  time_distance -= int_day * 86400000;
  int_hour = Math.floor(time_distance/3600000)
  time_distance -= int_hour * 3600000;
  int_minute = Math.floor(time_distance/60000)
  time_distance -= int_minute * 60000;
  int_second = Math.floor(time_distance/1000)
 
  // 时分秒为单数时、前面加零站位
  if(int_hour < 10)
  int_hour = "0" + int_hour;
  if(int_minute < 10)
  int_minute = "0" + int_minute;
  if(int_second < 10)
  int_second = "0" + int_second;
  
  // 显示时间
  time_d.innerHTML = int_day;
  time_h.innerHTML = int_hour;
  time_m.innerHTML = int_minute;
  time_s.innerHTML = int_second;
  
  setTimeout("show_time()",1000);
 }else{
  time_d.innerHTML = time_d.innerHTML;
  time_h.innerHTML = time_h.innerHTML;
  time_m.innerHTML = time_m.innerHTML;
  time_s.innerHTML = time_s.innerHTML;
 
  // clearTimeout(timerID)
 }
};
</script>

以上这篇JS倒计时实例_天时分秒就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javaScript 利用闭包模拟对象的私有属性
Dec 29 Javascript
EXTjs4.0的store的findRecord的BUG演示代码
Jun 08 Javascript
js模仿windows桌面图标排列算法具体实现(附图)
Jun 16 Javascript
利用JS来控制键盘的上下左右键(示例代码)
Dec 14 Javascript
js实现文本框宽度自适应文本宽度的方法
Aug 13 Javascript
使用PBFunc在Powerbuilder中支付宝当面付款功能
Oct 01 Javascript
JavaScript基于Dom操作实现查找、修改HTML元素的内容及属性的方法
Jan 20 Javascript
详解extract-text-webpack-plugin 的使用及安装
Jun 12 Javascript
使用JavaScript解析URL的方法示例
Mar 01 Javascript
微信小程序实现语音识别转文字功能及遇到的坑
Aug 02 Javascript
JS数组方法slice()用法实例分析
Jan 18 Javascript
JS实现横向跑马灯效果代码
Apr 20 Javascript
老生常谈javascript的面向对象思想
Aug 22 #Javascript
使用jQuery实现简单的tab框实例
Aug 22 #jQuery
基于node.js之调试器详解
Aug 22 #Javascript
js获取css的各种样式并且设置他们的方法
Aug 22 #Javascript
简单实现js上传文件功能
Aug 21 #Javascript
不得不看之JavaScript构造函数及new运算符
Aug 21 #Javascript
JavaScript实现简单图片轮播效果
Aug 21 #Javascript
You might like
利用discuz自带通行证整合dedecms的方法以及文件下载
2007/03/06 PHP
ThinkPHP的URL重写问题
2014/06/22 PHP
thinkphp3.0输出重复两次的解决方法
2014/12/19 PHP
详解php命令注入攻击
2019/04/06 PHP
键盘控制事件应用教程大全
2006/11/24 Javascript
firefox事件处理之自动查找event的函数(用于onclick=foo())
2010/08/05 Javascript
五个jQuery图片画廊插件 推荐
2011/05/12 Javascript
js模仿windows桌面图标排列算法具体实现(附图)
2013/06/16 Javascript
addEventListener()第三个参数useCapture (Boolean)详细解析
2013/11/07 Javascript
jquery获取checkbox的值并post提交
2015/01/14 Javascript
JavaScript将数组转换成CSV格式的方法
2015/03/19 Javascript
javascript实现平滑无缝滚动
2020/08/09 Javascript
BootStrap实现带有增删改查功能的表格(DEMO详解)
2016/10/26 Javascript
移动设备手势事件库Touch.js使用详解
2017/08/18 Javascript
关于express与koa的使用对比详解
2018/01/25 Javascript
简化vuex的状态管理方案的方法
2018/06/02 Javascript
Vue前后端不同端口的实现方法
2018/09/19 Javascript
关于Vue源码vm.$watch()内部原理详解
2019/04/26 Javascript
vue项目使用高德地图的定位及关键字搜索功能的实例代码(踩坑经验)
2020/03/07 Javascript
在Windows8上的搭建Python和Django环境
2014/07/03 Python
用python读写excel的方法
2014/11/18 Python
Python实现的多线程端口扫描工具分享
2015/01/21 Python
在SAE上部署Python的Django框架的一些问题汇总
2015/05/30 Python
python从入门到精通(DAY 1)
2015/12/20 Python
基于Python实现定时自动给微信好友发送天气预报
2018/10/25 Python
基于django channel实现websocket的聊天室的方法示例
2019/04/11 Python
boostrap modal 闪现问题的解决方法
2020/09/01 HTML / CSS
什么情况下你必须要把一个类定义为abstract的
2013/01/06 面试题
会计实习期自我鉴定
2013/10/06 职场文书
策划助理岗位职责
2013/11/18 职场文书
大学生村官工作感言
2014/01/10 职场文书
党员学习中共十八大思想报告
2014/09/12 职场文书
幼儿园教师安全责任书
2015/05/08 职场文书
python实现socket简单通信的示例代码
2021/04/13 Python
微信小程序实现录音Record功能
2021/05/09 Javascript
为什么RedisCluster设计成16384个槽
2021/09/25 Redis