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中通过prototype属性共享属性和方法的技巧实例
Mar 13 Javascript
JS采用绝对定位实现回到顶部效果完整实例
Jun 20 Javascript
利用原生js和jQuery实现单选框的勾选和取消操作的方法
Sep 04 Javascript
微信小程序 action-sheet底部菜单详解
Oct 27 Javascript
微信小程序 出现错误:{&quot;baseresponse&quot;:{&quot;errcode&quot;:-80002,&quot;errmsg&quot;:&quot;&quot;}}解决办法
Feb 23 Javascript
JS实现线性表的链式表示方法示例【经典数据结构】
Apr 11 Javascript
angularJS 发起$http.post和$http.get请求的实现方法
May 18 Javascript
vue使用element-ui的el-input监听不了回车事件的解决方法
Jan 12 Javascript
小程序tab页无法传递参数的方法
Aug 03 Javascript
JavaScript中变量、指针和引用功能与操作示例
Aug 04 Javascript
构建一个JavaScript插件系统
Oct 20 Javascript
JavaScript实现酷炫的鼠标拖尾特效
Feb 18 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 str_pad() 将字符串填充成指定长度的字符串
2010/02/23 PHP
php中unserialize返回false的解决方法
2014/09/22 PHP
php实现在限定区域里自动调整字体大小的类实例
2015/04/02 PHP
十个PHP高级应用技巧果断收藏
2015/09/25 PHP
thinkPHP订单数字提醒功能的实现方法
2016/12/01 PHP
php读取本地json文件的实例
2018/03/07 PHP
关于Yii中模型场景的一些简单介绍
2019/09/22 PHP
Jquery调用webService远程访问出错的解决方法
2010/05/21 Javascript
js判断60秒以及倒计时示例代码
2014/01/24 Javascript
深入理解Ajax的get和post请求
2016/06/02 Javascript
微信小程序 生命周期详解
2016/10/12 Javascript
js中通过getElementsByName访问name集合对象的方法
2016/10/31 Javascript
textarea 在浏览器中固定大小和禁止拖动的实现方法
2016/12/03 Javascript
详解微信小程序开发之——wx.showToast(OBJECT)的使用
2017/01/18 Javascript
js调用刷新界面的几种方式
2017/05/03 Javascript
移动端web滚动分页的实现方法
2017/05/05 Javascript
Vue2.x中的Render函数详解
2017/05/30 Javascript
vue实现全选和反选功能
2017/08/31 Javascript
JavaScript canvas仿代码流瀑布
2020/02/10 Javascript
[01:02:25]2014 DOTA2华西杯精英邀请赛 5 24 iG VS DK
2014/05/26 DOTA
[01:35]2014DOTA2西雅图邀请赛 专访狐狸妈青春献给刀塔
2014/07/08 DOTA
[04:47]DOTA2-潍坊风行电子俱乐部探秘
2014/08/08 DOTA
使用Python制作微信跳一跳辅助
2018/01/31 Python
Python可变参数*args和**kwargs用法实例小结
2018/04/27 Python
python中watchdog文件监控与检测上传功能
2020/10/30 Python
俄罗斯品牌服装和鞋子在线商店:BRIONITY
2020/03/26 全球购物
霸气队列口号
2014/06/18 职场文书
“四风”问题的主要表现和危害思想汇报
2014/09/19 职场文书
“向国旗敬礼”活动策划方案(4篇)
2014/09/27 职场文书
公务员政审材料范文
2014/12/23 职场文书
前台文员岗位职责
2015/02/04 职场文书
三严三实·严以律己心得体会
2016/01/13 职场文书
导游词之青岛崂山
2019/12/27 职场文书
刚学完怎么用Python实现定时任务,转头就跑去撩妹!
2021/06/05 Python
python四种出行路线规划的实现
2021/06/23 Python
通过Qt连接OpenGauss数据库的详细教程
2021/06/23 PostgreSQL