JS倒计时

倒计时是笔试时候很可能出现的考题之一，虽然不是很难，但是需要记忆的不少，甚是烦人。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>JS循环倒计时</title>

</head>

<body>

<div id="times_container"  style="border:1px; border-color:#999999; border-style:solid; background:#333333; color:#FFFFFF; 500px; height:40px; line-height:40px; font-size:24px">

距离活动结束还有：<span id="times_day"> </span>天 
<span id="times_hour"> </span>时 
<span id="times_minute"> </span>分    
<span id="second"> </span>秒   

</div>

 
<script type="text/javascript"  language="javascript">

setTimeout("count_down()",1000);//设置每一秒调用一次倒计时函数

 
//根据天，时，分，秒的ID找到相对应的元素

var time_day = document.getElementById("times_day");

var time_hour = document.getElementById("times_hour");

var time_minute = document.getElementById("times_minute");

var time_second = document.getElementById("second");

var time_end = new Date("2013/10/04 08:33:00");  // 设定活动结束结束时间

time_end = time_end.getTime();


//定义倒计时函数

function count_down(){ 

   var time_now = new Date();  // 获取当前时间

   time_now = time_now.getTime();

   var time_distance = time_end - time_now;  // 时间差：活动结束时间减去当前时间   

   var int_day, int_hour, int_minute, int_second;   

 if(time_distance >= 0){   

     // 相减的差数换算成天数   

     int_day = Math.floor(time_distance/86400000)

     time_distance -= int_day * 86400000; 

 

 // 相减的差数换算成小时

        int_hour = Math.floor(time_distance/3600000) 

        time_distance -= int_hour * 3600000;  

 

// 相减的差数换算成分钟   

     int_minute = Math.floor(time_distance/60000)    

    time_distance -= int_minute * 60000; 
// 相减的差数换算成秒数  

      int_second = Math.floor(time_distance/1000)    

 

    // 判断小时小于10时，前面加0进行占位

        if(int_hour < 10) 

        int_hour = "0" + int_hour;  
// 判断分钟小于10时，前面加0进行占位      

  if(int_minute < 10)    

   int_minute = "0" + int_minute;  

 

 // 判断秒数小于10时，前面加0进行占位 

       if(int_second < 10) 

       int_second = "0" + int_second;       

 

// 显示倒计时效果       

time_day.innerHTML = int_day;

time_hour.innerHTML = int_hour; 

time_minute.innerHTML = int_minute; 

time_second.innerHTML = int_second;

setTimeout("count_down()",1000);

    }else{

//指定的结束日期结束后，往后推迟3天，或者称之为：往后加3天

//在这里可以非常灵活的设置：比如往后推迟2天或往后加2天：2*24*60*60*1000

//比如往后推迟1天或往后加1天：1*24*60*60*1000

//比如往后推迟2小时或往后加2小时：2*60*60*1000

// 比如往后推迟40分钟或往后加40分钟：40*1000这里设置根据大家需要，灵活设置。

 time_end=time_end+3*24*60*60*1000;

setTimeout("count_down()",1000); 

   }

}

</script>

</body>

</html>
相关推荐
