js简单倒计时实现代码


Posted in Javascript onApril 30, 2016

本文实例讲述了js简单倒计时实现代码。分享给大家供大家参考,具体如下:

<div class="time">
 距离活动结束还有<span id="day"></span>天
 <span id="hours"></span>小时
 <span id="min"></span>分
 <span id="sec"></span>秒
</div>
<script type="text/javascript">
var day = document.getElementById("day");
var hours = document.getElementById("hours");
var min = document.getElementById("min");
var sec = document.getElementById("sec");
var DifferenceHour = -1;
var DifferenceMinute = -1;
var DifferenceSecond = -1;
//var Tday = new Date("07 20,2016 10:00:00")  //**倒计时时间点-注意格式
var Tday = new Date("07/20/2016 10:00:00");  //IE:月/日/年
var daysms = 24 * 60 * 60 * 1000;
var hoursms = 60 * 60 * 1000;
var Secondms = 60 * 1000;
var microsecond = 1000;
function clock () {
 var time = new Date();
 var hour = time.getHours();
 var minute = time.getMinutes();
 var second = time.getSeconds();
 var timevalue = "" + ((hour > 12) ? hour-12:hour);
 timevalue += ((minute < 10) ? ":0":":") + minute;
 timevalue += ((second < 10) ? ":0":":") + second;
 timevalue += ((hour > 12) ? " PM":" AM");
 // document.formnow.now.value = timevalue
 var convertHour = DifferenceHour;
 var convertMinute = DifferenceMinute;
 var convertSecond = DifferenceSecond;
 var Diffms = Tday.getTime() - time.getTime();
 DifferenceHour = Math.floor(Diffms / daysms);
 Diffms -= DifferenceHour * daysms;
 DifferenceMinute = Math.floor(Diffms / hoursms);
 Diffms -= DifferenceMinute * hoursms;
 DifferenceSecond = Math.floor(Diffms / Secondms);
 Diffms -= DifferenceSecond * Secondms;
 var dSecs = Math.floor(Diffms / microsecond);
 if (convertHour != DifferenceHour) {
 day.innerHTML = DifferenceHour;
 }
 if (convertMinute != DifferenceMinute) {
 hours.innerHTML = DifferenceMinute;
 }
 if (convertSecond != DifferenceSecond) {
 min.innerHTML = DifferenceSecond;
 }
 sec.innerHTML = dSecs;
 // document.formnow.Tnow.value= DifferenceHour DifferenceMinute + DifferenceSecond + dSecs
 setTimeout("clock()", 1000);
}
clock();
</script>

更多关于JavaScript相关内容可查看本站专题:《JavaScript时间与日期操作技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
获取JavaScript用户自定义类的类名称的代码
Mar 08 Javascript
js基于cookie记录来宾姓名的方法
Jul 19 Javascript
javascript闭包功能与用法实例分析
Apr 06 Javascript
Angular2入门教程之模块和组件详解
May 28 Javascript
jQuery判断网页是否已经滚动到浏览器底部的实现方法
Oct 27 jQuery
彻底理解js面向对象之继承
Feb 04 Javascript
浅谈redux以及react-redux简单实现
Aug 28 Javascript
Node批量爬取头条视频并保存方法
Sep 20 Javascript
angular5 子组件监听父组件传入值的变化方法
Sep 30 Javascript
jQuery.validate.js表单验证插件的使用代码详解
Oct 22 jQuery
vue回到顶部监听滚动事件详解
Aug 02 Javascript
微信小程序 腾讯地图SDK 获取当前地址实现解析
Aug 12 Javascript
一个用jquery写的判断div滚动条到底部的方法【推荐】
Apr 29 #Javascript
浅析jquery如何判断滚动条滚到页面底部并执行事件
Apr 29 #Javascript
jQuery中数据缓存$.data的用法及源码完全解析
Apr 29 #Javascript
浅析Javascript中bind()方法的使用与实现
Apr 29 #Javascript
深入剖析JavaScript中的函数currying柯里化
Apr 29 #Javascript
javascript中利用柯里化函数实现bind方法【推荐】
Apr 29 #Javascript
jQuery Ajax 实例代码 ($.ajax、$.post、$.get)
Apr 29 #Javascript
You might like
PHP把网页保存为word文件的三种方法
2014/04/01 PHP
PHP实现数组递归转义的方法
2014/08/28 PHP
php类中的各种拦截器用法分析
2014/11/03 PHP
Laravel 5框架学习之日期,Mutator 和 Scope
2015/04/08 PHP
javascript TextArea动态显示剩余字符
2008/10/22 Javascript
JS 控件事件小结
2012/10/31 Javascript
js判断是否为ie的方法小结
2014/01/13 Javascript
js调试系列 控制台命令行API使用方法
2014/06/18 Javascript
jQuery 1.9移除了$.browser可以使用$.support来替代
2014/09/03 Javascript
纯js实现重发验证码按钮倒数功能
2015/04/21 Javascript
javascript下拉列表菜单的实现方法
2015/11/18 Javascript
javascript基础知识分享之类与函数化
2016/02/13 Javascript
用canvas 实现个图片三角化(LOW POLY)效果
2016/02/18 Javascript
jQuery实现可移动选项的左右下拉列表示例
2016/12/26 Javascript
AngularJS监听路由变化的方法
2017/03/07 Javascript
Vue中父组件向子组件通信的方法
2017/07/11 Javascript
详解vue axios中文文档
2017/09/12 Javascript
微信小程序之页面跳转和参数传递的实现
2017/09/29 Javascript
jQuery基于闭包实现的显示与隐藏div功能示例
2018/06/09 jQuery
Vue2.2.0+新特性整理及注意事项
2018/08/22 Javascript
详解element-ui日期时间选择器的日期格式化问题
2019/04/08 Javascript
vue 项目 iOS WKWebView 加载
2019/04/17 Javascript
javascript如何使用函数random来实现课堂随机点名方法详解
2020/07/28 Javascript
vue.js+element 默认提示中英文操作
2020/11/11 Javascript
Python实现以时间换空间的缓存替换算法
2016/02/19 Python
Python自动发邮件脚本
2017/03/31 Python
解决python文件字符串转列表时遇到空行的问题
2017/07/09 Python
使用Python通过win32 COM打开Excel并添加Sheet的方法
2018/05/02 Python
浅谈python 读excel数值为浮点型的问题
2018/12/25 Python
Django中使用CORS实现跨域请求过程解析
2019/08/05 Python
Python使用selenium + headless chrome获取网页内容的方法示例
2019/10/16 Python
使用HTML5 Canvas API中的clip()方法裁剪区域图像
2016/03/25 HTML / CSS
2014年党员学习“三严三实”思想汇报
2014/09/15 职场文书
2014党委书记四风对照检查材料思想汇报
2014/09/21 职场文书
2014年师德师风工作总结
2014/11/25 职场文书
2015年办税服务厅工作总结
2015/07/23 职场文书