zl程序教程

您现在的位置是:首页 >  前端

当前栏目

javascript学习笔记(四)倒计时程序代码

JavaScript笔记学习 倒计时 程序代码
2023-06-13 09:14:27 时间
首先看全部完整代码:

countDowntest

截止日期



html部分代码:
可在文本框中输入倒计时的时间,如果当前时间小于截止时间,则正常返回,反之,则返回距离截止日期到现在的时间
复制代码代码如下:

<p>
<labelfor="deadline">截止日期</label>
<inputtype="text"value="2011-06-11"id="deadline"/>
<inputtype="button"value="开始倒计时"onclick="window.setInterval("countDown(\"deadline\")",1000)"/>
</p>
<pid="showTime"></p>

javascript部分代码:
复制代码代码如下:

functioncountDown(endDate){
varnow=newDate();
vardeadtime=document.getElementById(endDate);
vardeadline=newDate(deadtime.value);
//本地时间与格林威治标准时间(GMT)的分钟差
vartimeDiff=now.getTimezoneOffset();
//此处有些不解,如果把分钟差转化成毫秒应该是timeDiff*60*1000,但是这样返回的数据不正确!
varleave=Math.abs(deadline.getTime()-now.getTime()+timeDiff*60);
varminute=1000*60;
varhour=minute*60;
varday=hour*24;
varcountDay=Math.floor(leave/day);
//varcountHour=Math.floor((leave-day*countDay)/hour);两种计算思路
varcountHour=Math.floor(leave/hour-countDay*24);
varcountMinute=Math.floor(leave/minute)-countDay*24*60-countHour*60;
varcountSecond=Math.floor(leave/1000)-countDay*24*60*60-countHour*60*60-countMinute*60;
varoutStr="";
if(deadline<now){
outStr="距离"+deadtime.value+"已有"+countDay+"天"+countHour+"小时"+countMinute+"分"+countSecond+"秒";
}else{
outStr="距离"+deadtime.value+"还差"+countDay+"天"+countHour+"小时"+countMinute+"分"+countSecond+"秒";
}
varshowTime=document.getElementById("showTime");
showTime.innerHTML=outStr;
}