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 js cookie的存储,获取和删除
Dec 29 Javascript
jQuery toggle()设置CSS样式
Nov 05 Javascript
js 屏蔽鼠标右键脚本附破解方法
Dec 03 Javascript
JS 加入收藏夹的代码(主流浏览器通用)
May 13 Javascript
禁止选中文字兼容IE、Chrome、FF等
Sep 04 Javascript
jQuery中:first选择器用法实例
Dec 30 Javascript
jQuery晃动层特效实现方法
Mar 09 Javascript
JS响应鼠标点击实现两个滑块区间拖动效果
Oct 26 Javascript
微信小程序 textarea 详解及简单使用方法
Dec 05 Javascript
微信小程序实现两边小中间大的轮播效果的示例代码
Dec 07 Javascript
vue实现form表单与table表格的数据关联功能示例
Jan 29 Javascript
微信小程序如何刷新当前界面的实现方法
Jun 07 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
第四节 构造函数和析构函数 [4]
2006/10/09 PHP
php自定文件保存session的方法
2014/12/10 PHP
php获取QQ头像并显示的方法
2014/12/23 PHP
PHP实现的文件浏览器功能简单示例
2019/09/12 PHP
利用jQuery插件扩展识别浏览器内核与外壳的类型和版本的实现代码
2011/10/22 Javascript
Js动态添加复选框Checkbox的实例方法
2013/04/08 Javascript
浅析nodejs实现Websocket的数据接收与发送
2015/11/19 NodeJs
JavaScript面向对象编写购物车功能
2016/08/19 Javascript
微信小程序 使用picker封装省市区三级联动实例代码
2016/10/28 Javascript
AngularJS入门教程之路由机制ngRoute实例分析
2016/12/13 Javascript
Angular2开发——组件规划篇
2017/03/28 Javascript
Textarea输入字数限制实例(兼容iOS&amp;安卓)
2017/07/06 Javascript
使用travis-ci如何持续部署node.js应用详解
2017/07/30 Javascript
关于Vue项目跨平台运行问题的解决方法
2018/09/18 Javascript
vue2.0实现的tab标签切换效果(内容可自定义)示例
2019/02/11 Javascript
JS实现checkbox互斥(单选)功能示例
2019/05/04 Javascript
JavaScript中的类型检查
2020/02/03 Javascript
JavaScript实现留言板案例
2020/03/17 Javascript
python实现批量转换文件编码(批转换编码示例)
2014/01/23 Python
python多线程编程中的join函数使用心得
2014/09/02 Python
python的else子句使用指南
2016/02/27 Python
Python处理PDF及生成多层PDF实例代码
2017/04/24 Python
Pycharm 操作Django Model的简单运用方法
2018/05/23 Python
Python告诉你木马程序的键盘记录原理
2019/02/02 Python
Python元组知识点总结
2019/02/18 Python
Django中如何防范CSRF跨站点请求伪造攻击的实现
2019/04/28 Python
Python Numpy 自然数填充数组的实现
2019/11/28 Python
JetBrains PyCharm(Community版本)的下载、安装和初步使用图文教程详解
2020/03/19 Python
使用Python实现音频双通道分离
2020/12/25 Python
机械系大学毕业生推荐信
2013/11/27 职场文书
车辆年审委托书范本
2014/09/18 职场文书
2014乡镇领导班子四风对照检查材料思想汇报
2014/10/05 职场文书
学校政风行风自查自纠报告
2014/10/21 职场文书
创业计划书之零食店(进口)
2019/09/24 职场文书
教你如何使用Python开发一个钉钉群应答机器人
2021/06/21 Python
VW、VH适配移动端的解决方案与常见问题
2023/05/21 HTML / CSS