Javascript 倒计时源代码.(时.分.秒) 详细注释版


Posted in Javascript onMay 09, 2011

随便写写!闲着无聊!代码如有bug之处欢迎阁下强力拍砖!
JS CODE

<script type="text/javascript" language="javascript"> 
//总时间,已分为单位 
var time = 100; 
//小时 
var h = parseInt(time / 60) > 0 ? parseInt(time / 60) : 0; 
//分 
var m = time % 60; 
//秒 
var s = 60; 
//输出到当前Script的Dom位置 
document.write('<span>剩余<font id="f_hh">' + h + '</font>小时<font id="f_mm">' + m + '</font>分<font id="f_ss">' + s + '</font>秒</span>'); 
//开始执行倒计时 
var timeInterval = setInterval(function () { 
//如果时、分、秒都为0时将停止当前的倒计时 
if (h == 0 && m == 0 && s == 0) { clearInterval(timeInterval); return; } 
//当秒走到0时,再次为60秒 
if (s == 0) { s = 60; } 
if (s == 60) { 
//每次当秒走到60秒时,分钟减一 
m -= 1; 
//当分等于0时并且小时还多余1个小时的时候进里面看看 
if (m == 0 && h > 0) { 
//小时减一 
h -= 1; 
//分钟自动默认为60分 
m = 60; 
//秒自动默认为60秒 
s = 60; 
} 
} 
//秒继续跳动,减一 
s -= 1; 
//小时赋值 
document.getElementById('f_hh').innerHTML = h; 
//分钟赋值 
document.getElementById('f_mm').innerHTML = m; 
//秒赋值 
document.getElementById('f_ss').innerHTML = s; 
}, 1000); 
</script>

HTML CODE
<html> 
<head> 
<title>Date Demo</title> 
</head> 
<body> 
<script type="text/javascript" language="javascript"> 
//总时间,已分为单位 
var time = 100; 
//小时 
var h = parseInt(time / 60) > 0 ? parseInt(time / 60) : 0; 
//分 
var m = time % 60; 
//秒 
var s = 60; 
//输出到当前Script的Dom位置 
document.write('<span>剩余<font id="f_hh">' + h + '</font>小时<font id="f_mm">' + m + '</font>分<font id="f_ss">' + s + '</font>秒</span>'); 
//开始执行倒计时 
var timeInterval = setInterval(function () { 
//如果时、分、秒都为0时将停止当前的倒计时 
if (h == 0 && m == 0 && s == 0) { clearInterval(timeInterval); return; } 
//当秒走到0时,再次为60秒 
if (s == 0) { s = 60; } 
if (s == 60) { 
//每次当秒走到60秒时,分钟减一 
m -= 1; 
//当分等于0时并且小时还多余1个小时的时候进里面看看 
if (m == 0 && h > 0) { 
//小时减一 
h -= 1; 
//分钟自动默认为60分 
m = 60; 
//秒自动默认为60秒 
s = 60; 
} 
} 
//秒继续跳动,减一 
s -= 1; 
//小时赋值 
document.getElementById('f_hh').innerHTML = h; 
//分钟赋值 
document.getElementById('f_mm').innerHTML = m; 
//秒赋值 
document.getElementById('f_ss').innerHTML = s; 
}, 1000); 
</script> 
</body> 
</html>
Javascript 相关文章推荐
jQuery插件开发全解析
Oct 10 Javascript
JavaScript实现快速排序(自已编写)
Dec 19 Javascript
Jquery实现仿腾讯微博发表广播
Nov 17 Javascript
JQuery中绑定事件(bind())和移除事件(unbind())
Feb 27 Javascript
Javascript实现计算个人所得税
May 10 Javascript
IE8 内存泄露(内存一直增长 )的原因及解决办法
Apr 06 Javascript
BootStrap文件上传样式超好看【持续更新】
May 10 Javascript
JS实现添加,替换,删除节点元素的方法
Jun 30 Javascript
JavaScript基于对象去除数组重复项的方法
Oct 09 Javascript
EasyUI 结合JS导出Excel文件的实现方法
Nov 10 Javascript
Mongoose学习全面理解(推荐)
Jan 21 Javascript
vue 插件的方法代码详解
Jun 06 Javascript
Chrome Form多次提交表单问题的解决方法
May 09 #Javascript
JQuery将文本转化成JSON对象需要注意的问题
May 09 #Javascript
通过Jscript中@cc_on 语句识别IE浏览器及版本的代码
May 07 #Javascript
基于JQUERY的两个ListBox子项互相调整的实现代码
May 07 #Javascript
基于jquery的lazy loader插件实现图片的延迟加载[简单使用]
May 07 #Javascript
基于jQuery的倒计时插件代码
May 07 #Javascript
基于Jquery的将DropDownlist的选中值赋给label的实现代码
May 06 #Javascript
You might like
浅谈Windows下 PHP4.0与oracle 8的连接设置
2006/10/09 PHP
php中static静态变量的使用方法详解
2010/06/04 PHP
hadoop常见错误以及处理方法详解
2013/06/19 PHP
php生成随机颜色的方法
2014/11/13 PHP
PHP开发注意事项总结
2015/02/04 PHP
PHP中使用GD库绘制折线图 折线统计图的绘制方法
2015/11/09 PHP
php实现微信扫码自动登陆与注册功能
2016/09/22 PHP
PHP中仿制 ecshop验证码实例
2017/01/06 PHP
实例讲解PHP中使用命名空间
2019/01/27 PHP
详解PHP队列的实现
2019/03/14 PHP
php获取小程序码的实现代码(B类接口)
2020/06/13 PHP
PHP 出现 http500 错误的解决方法
2021/03/09 PHP
JavaScript调用传递变量参数的相关问题及解决办法
2015/11/01 Javascript
Easyui form combobox省市区三级联动
2016/01/13 Javascript
浅谈javascript中new操作符的原理
2016/06/07 Javascript
js鼠标移动时禁止选中文字
2017/02/19 Javascript
JS中去掉array中重复元素的方法
2017/05/26 Javascript
nodejs超出最大的调用栈错误问题
2017/12/27 NodeJs
vue路由跳转传参数的方法
2019/05/06 Javascript
vue根据条件不同显示不同按钮的操作
2020/08/04 Javascript
vuex的数据渲染与修改浅析
2020/11/26 Vue.js
[04:48]DOTA2上海特锦赛小组赛第三日 TOP10精彩集锦
2016/02/28 DOTA
windows及linux环境下永久修改pip镜像源的方法
2016/11/28 Python
python实现泊松图像融合
2018/07/26 Python
python中正则表达式 re.findall 用法
2018/10/23 Python
python2和python3的输入和输出区别介绍
2018/11/20 Python
pthon贪吃蛇游戏详细代码
2019/01/27 Python
python集合删除多种方法详解
2020/02/10 Python
Tensorflow训练MNIST手写数字识别模型
2020/02/13 Python
土耳其时尚潮流在线购物网站:Trendyol
2017/10/10 全球购物
上课说话检讨书大全
2014/01/22 职场文书
太太口服液广告词
2014/03/20 职场文书
违反交通安全法检讨书
2014/10/24 职场文书
导师工作推荐信
2015/03/27 职场文书
Golang实现可重入锁的示例代码
2022/05/25 Golang
apache虚拟主机配置的三种方式(小结)
2022/07/23 Servers