JavaScript倒计时脚本

来源:互联网 发布:linux下查看系统日志 编辑:程序博客网 时间:2024/05/01 20:21

JavaScript倒计时在Web中用得非常广泛,比如常见的团购啊、还有什么值得期待的事情,都可以用到倒计时。现在举了四个例子,比如时间长的倒计时,小时倒计时,最简的倒计时,还有秒表等等,应该可以满足大部分需求。

1. 比较长时间的倒计时

2015年还有:

 

<script type="text/javascript">   startclock();var timerID = null;   var timerRunning = false;   function showtime() {   Today = new Date();var year = Today.getFullYear();document.getElementById("next_yeat").innerHTML = year + 1;var NowHour = Today.getHours();   var NowMinute = Today.getMinutes();   var NowMonth = Today.getMonth();   var NowDate = Today.getDate();   var NowYear = Today.getYear();   var NowSecond = Today.getSeconds();   if (NowYear <2000)   NowYear=1900+NowYear;   Today = null;   Hourleft = 23 - NowHour   Minuteleft = 59 - NowMinute   Secondleft = 59 - NowSecond   Yearleft = year - NowYear   Monthleft = 12 - NowMonth - 1 Dateleft = 31 - NowDate   if (Secondleft<0)   {   Secondleft=60+Secondleft;   Minuteleft=Minuteleft-1;   }   if (Minuteleft<0)   {    Minuteleft=60+Minuteleft;   Hourleft=Hourleft-1;   }   if (Hourleft<0)   {   Hourleft=24+Hourleft;   Dateleft=Dateleft-1;   }   if (Dateleft<0)   {   Dateleft=31+Dateleft;   Monthleft=Monthleft-1;   }   if (Monthleft<0)   {   Monthleft=12+Monthleft;   Yearleft=Yearleft-1;   }   Temp=Yearleft+'年, '+Monthleft+'月, '+Dateleft+'天, '+Hourleft+'小时, '+Minuteleft+'分, '+Secondleft+'秒';document.form1.left.value=Temp;   timerID = setTimeout("showtime()",1000);   timerRunning = true;   }   var timerID = null;   var timerRunning = false;   function stopclock () {   if(timerRunning)   clearTimeout(timerID);   timerRunning = false;   }   function startclock () {   stopclock();   showtime();   }   // -->   </script>   

2. 小时倒计时(短时间倒计时)

距离结束还有 59 分 27 秒

<script type="text/javascript">   <!--   //一个小时,按秒计算,可以自己调整时间var maxtime = 60*60 function CountDown(){   if(maxtime>=0){   minutes = Math.floor(maxtime/60);   seconds = Math.floor(maxtime%60);   msg = "距离结束还有 "+minutes+" 分 "+seconds+" 秒";   document.all["timer"].innerHTML=msg;   if(maxtime == 5*60) alert('注意,还有5分钟!');   --maxtime;   }   else{   clearInterval(timer);   alert("时间到,结束!");   }   }   timer = setInterval("CountDown()",1000);   //-->   </script>

3. 最简倒计时

现在离 2012 还有: -922 天

<script Language="JavaScript">    <!-- Begin      var timedate= new Date("January 14,2012");      var times="2012";      var now = new Date();      var date = timedate.getTime() - now.getTime();      var time = Math.floor(date / (1000 * 60 * 60 * 24));      if (time >= 0) ;   document.write("<p>现在离 "+times+" 还有: <b>"+time +"</b> 天</p>");   // End -->   </script>   

4. 秒表功能

00:01:11:00  

 

<script type="text/javascript">   var normalelapse = 100;   var nextelapse = normalelapse;   var counter;    var startTime;   var start = clock.innerText;    var finish = "00:00:00:00";   var timer = null;   // 开始运行   function run() {   startB.disabled = true;   endB.disabled = false;   counter = 0;   // 初始化开始时间   startTime = new Date().valueOf();   // nextelapse是定时时间, 初始时为100毫秒   // 注意setInterval函数: 时间逝去nextelapse(毫秒)后, onTimer才开始执行   timer = window.setInterval("onTimer()", nextelapse);    }   // 停止运行   function stop() {   startB.disabled = false;   endB.disabled = true;   window.clearTimeout(timer);   }   window.onload = function() {   endB.disabled = true;   }   // 倒计时函数   function onTimer()   {   if (start == finish)   {   window.clearInterval(timer);   alert("time is up!");   return;   }   var hms = new String(start).split(":");   var ms = new Number(hms[3]);   var s = new Number(hms[2]);   var m = new Number(hms[1]);   var h = new Number(hms[0]);   ms -= 10;   if (ms < 0)   {   ms = 90;   s -= 1;   if (s < 0)   {   s = 59;   m -= 1;   }   if (m < 0)   {   m = 59;   h -= 1;   }   }   var ms = ms < 10 ? ("0" + ms) : ms;   var ss = s < 10 ? ("0" + s) : s;   var sm = m < 10 ? ("0" + m) : m;   var sh = h < 10 ? ("0" + h) : h;   start = sh + ":" + sm + ":" + ss + ":" + ms;   clock.innerText = start;   // 清除上一次的定时器   window.clearInterval(timer);   // 自校验系统时间得到时间差, 并由此得到下次所启动的新定时器的时间nextelapse   counter++;    var counterSecs = counter * 100;   var elapseSecs = new Date().valueOf() - startTime;   var diffSecs = counterSecs - elapseSecs;   nextelapse = normalelapse + diffSecs;   diff.value = counterSecs + "-" + elapseSecs + "=" + diffSecs;   next.value = "nextelapse = " + nextelapse;   if (nextelapse < 0) nextelapse = 0;   // 启动新的定时器   timer = window.setInterval("onTimer()", nextelapse);    }   </script>
0 0
原创粉丝点击