<!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 创建无缝的客户机 - 服务器通信。
实现倒计时很容易，关键是你要求刷新页面，不能停止倒计时1、使用iframe，嵌入页面，父页上执行js操作，这样子页面刷新后会接着显示倒计时；
2、在后台实现，如使用java的timer类来实现倒计时，前台通过ajax获取倒计时结果，无论前端页面怎么刷新，不会停止倒计时
前端的好写，简单写下，仅供参考
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>无标题文档</title>
</head>
<body onLoad="startCount()" onUnload="fromClose()">
<iframe id="myFrame" src="innerPage.html" height="500" width="500"></iframe>
</body>
</html>
<script>
var timer
var count=10
function startCount(){
timer=window.setInterval("myTimeBack()",1000)
}
function myTimeBack(){
myFrame.document.getElementById("myInput").value=count
count=count-1
if(count==0)
count=10
}
function fromClose(){
clearInterval(timer)
}
</script>
//嵌入的页面innerPage.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<input type="text" value="" id="myInput" style="width:50">
<button onClick="refeshFrame()" style="width:80">refresh</button>
</body>
</html>
<script>
function refeshFrame(){
this.location.href=this.location.toString()
}
</script>
逻辑如下：
1、先判断两个时间的时间差，当然如果得到的时间是13位时间戳的话你需要转化一下
2、判断时间够一天显示天数，够一小时显示小时数
相关代码：
//获取时间，时间戳转换，不是则不转var mydate1 = new Date(parseInt(time1.replace("/Date(", "").replace(")/", "")))
var mydate2 = new Date(parseInt(time2.replace("/Date(", "").replace(")/", "")))
//获取剩余秒数
var timerc =dateDiff(mydate, '2015/05/19 10:00:00') / 1000
function dateDiff(date1, date2) {
var dt1 = new Date(Date.parse(date1))
var dt2 = new Date(Date.parse(date2))
try {
return Math.round((dt2.getTime() - dt1.getTime()))
}
catch (e) {
return e.message
}
}
//循环调用倒计时
function add() { //加时函数
--timerc //时间变量自减1
var day = parseInt(timerc / 86400)
var hour = parseInt((timerc % 86400) / 3600)
var min = parseInt((timerc % 3600) / 60)
var sec = Number(parseInt(timerc % 60 / 10)).toString() + Number(parseInt((timerc % 10))).toString()
if (day > 0) { //如果不到5分钟
$("#day").html(day + '天') //写入天数
$("#hour").html(hour + '时') //写入小时数
$("#min").html(min + '分') //写入分钟数
$("#sec").html(sec + '秒') //写入秒数（两位）
}
else if (hour > 0) {
$("#hour").html(hour + '时') //写入小时数
$("#min").html(min + '分') //写入分钟数
$("#sec").html(sec + '秒') //写入秒数（两位）
}
else if (min > 0) {
$("#min").html(min + '分') //写入分钟数
$("#sec").html(sec + '秒') //写入秒数（两位）
}
else if (sec != '00') {
$("#sec").html(sec + '秒') //写入秒数（两位）
}
else {
tiao(activity) return true//时间到0调用函数
}
setTimeout("add()", 1000) //设置1000毫秒以后执行一次本函数
}
望采纳！
