<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>活动倒计时</title>
<style>
*
{
margin:0;
padding:0;
list-style:none;
}
body
{
font-size:18px;
text-align:center;
}
.time
{
height:30px;
padding:200px;
}
a{
text-decoration: none;
color: black;
display: block;
font-family: "宋体";
font-style: oblique;
}
</style>
</head>
<body>
<div class="time">
<span id="view"></span>
<a id="jump" href="http://www.baidu.com">立即报名</a>
</div>
<script src="js/jquery-1.7.2.js"></script>
<script>
$(document).ready(function(){
// stopFlag为定时任务对象
var stopFlag = setInterval(function(){getDistanceTime('2018-06-10 21:34:30','view')},0);
function getDistanceTime(time,view){
var endTime= new Date(Date.parse(time.replace(/-/g, "/")));/*replace将时间字符串中所有的'-'替换成'/',parse将时间格式的字符串转换成毫秒*/
var nowTime = new Date();
var distance =endTime.getTime() - nowTime.getTime();/*getTime把一个date对象转换成毫秒*/
var day = 0;
var hour = 0;
var minute = 0;
var second = 0;
if(distance >=0){
day = Math.floor(distance/1000/60/60/24);
hour = Math.floor(distance/1000/60/60%24);
minute = Math.floor(distance/1000/60%60);
second = Math.floor(distance/1000%60);
}else{
stop(); // 终止定时任务
}
$("#view").html(day + "天" + hour + "时" + minute + "分" + second + "秒")
}
function stop() {
// 终止指定的定时任务
window.clearInterval(stopFlag);
//$("#jump").attr("disabled"); // 去除属性
$("#jump").attr("href","#").click(function () {
alert("活动已经终止，请留意官网最新动态！");
});
}
});
</script>
</body>
</html>