<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html charset=utf-8" />
<title>js实现倒计时60秒的简单代码(推荐)</title>
<script type="text/javascript" src="js/jquery.js"></script>
</head>
<body>
<input type="button" id="btn" value="免费获取验证码" onclick="settime(this)" />
<script type="text/javascript">
var countdown=60
function settime(val) {
if (countdown == 0) {
val.removeAttribute("disabled")
val.value="免费获取验证码"
countdown = 5
} else {
val.setAttribute("disabled", true)
val.value="重新发送(" + countdown + ")"
countdown--
setTimeout(function() {
settime(val)
},1000)
}
}
</script>
</body>
</html>
JavaScript简介
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后,可由所有的现代浏览器执行。
JavaScript 课外书
如果 JavaScript 教程学习完毕,并且需要更深入地学习这门语言,《JavaScript 高级教程》绝对是您最好的选择。本教程从 JavaScript 的历史开始讲起,直到当前它对 XML 和 Web 服务的支持。
将学习到如何扩展该语言,以使它适应特殊的需求。
还将学到如何使用 JavaScript 创建无缝的客户机 - 服务器通信。
在接触到的项目中,有页面需要做倒计时的效果,原本以为很容易,做好之后就提交测试了,但是好巧不巧,测试人员手机屏幕在倒计时过程中熄灭,唤醒屏幕之后发现倒计时是接着黑屏时候的时间继续进行。
问题:手机屏幕熄灭之后,倒计时停止,手机屏幕亮起之后,倒计时接着之前的时间倒计时(即,黑屏这段时间倒计时没有减少)
解决方法:获取倒计时开始时间start_time,在调用countTime是获取一下当前时间end_time,两者的时间差即为休眠时间,使用倒计时总时间-时间差,即为新的倒计时时间
亲测有效,若有其他的好方法求告知