关于jacascript的倒计时

来源：互联网发布：标准化知乎编辑：程序博客网时间：2024/06/05 06:08

首先，先贴代码:

(只是为了讲这个过程，所以页面很简单)

提醒：//////var times="2016,5,7";
var end = new Date (times);///////

在这句中，一定要切记，必须要是双引号，如果不加引号，如var end=new Date(2016,5,7)，那么就会报错，就会显示为2016,6,7而不是我们想要的2016,5,7.

//////var milsec = Math.floor((end.getTime() - now.getTime())/1000);///////////

这一句，虽然把时间换算为了毫秒，但是更加方便计算；至于用floor（）而不是用ceil（），自己想想吧，很简单的逻辑。

<!DOCTYPE HTML>

<html>
<head>
<meta charset="UTF-8" />
<title>倒计时的计算！</title>
<style>
#clock{
width:100%;
height:60px;
line-height: 60px;
background-color: #626262;
text-align: center;
font-size: 40px;
}
</style>
<script type="text/javascript">
window.onload = function ()
{
jisuan ();
};

function CheckTime(i){ //解决时间表示单个位数问题，如不会是1而是01；
if(i<10){
i="0"+i;
}
return i;
}
function jisuan () //主要函数；
{
var times="2016,5,7";
var end = new Date (times);
var now = new Date ();

var milsec = Math.floor((end.getTime() - now.getTime())/1000);//总秒数；

var day = Math.floor( (milsec / (24 * 3600)));//天数；

var hours = Math.floor( ((milsec % (3600 * 24)) / 3600));//小时；

var minutes = Math.floor( ((milsec % 3600) / 60));//分钟；

var seconds = milsec % 60;//秒；

hours=CheckTime(hours);
minutes=CheckTime(minutes);
seconds=CheckTime(seconds);
if (milsec < 0)
{
alert("时间已经过期了！！！");
}
document.getElementById ("clock").innerHTML = "离"+times+"还剩" + day + "天" + hours + "小时" + minutes + "分钟" + seconds + "秒";
setTimeout ('jisuan()', 1000);
}

</script>
</head>
<body>
<div id="clock"></div>
</body>

</html>

0 0