JS倒计时大全

From JS倒计时大全




1.世界末日倒计时

<form name="form1">
    <div align="center" align="center">
        <center>离2012年<span class='wp_keywordlink_affiliate'><a href="http://lxy.me/tag/世界末日" title="查看 世界末日 中的全部文章" target="_blank">世界末日</a></span>还有:<br>
            <input type="textarea" name="left" size="35" style="text-align: center">
        </center>
    </div>
</form>
<script LANGUAGE="javascript">
    startclock()
    var timerID = null;
    var timerRunning = false;
    function showtime() {
        Today = new Date();
        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 = 00 - NowHour
        Minuteleft = 00 - NowMinute
        Secondleft = 00 - NowSecond
        Yearleft = 2012 - NowYear
        Monthleft = 12 - NowMonth - 1
        Dateleft = 21 - 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.小时倒计时，可用于在线考试

<SCRIPT LANGUAGE="JavaScript">
    <!--
    var maxtime = 60 * 60 //一个小时，按秒计算，自己调整!  
    function CountDown() {
        if (maxtime >= 0) {
            minutes = Math.floor(maxtime / 60);
            seconds = Math.floor(maxtime % 60);
            msg = "距离结束还有" + minutes + "分" + seconds + "秒";
            document.getElementByIdx_x("timer").innerHTML = msg;
            if (maxtime == 5 * 60) alert('注意，还有5分钟!');
            --maxtime;
        }
        else {
            clearInterval(timer);
            alert("时间到，结束!");
        }
    }
    timer = setInterval("CountDown()", 1000);
    //-->  
</SCRIPT>
<div id="timer" style="color:red"></div>  

3.简单倒计时（仅显示天数）

<Script Language="JavaScript">
    var timedate = new Date("January 14,2013");
    var times = "研究生<span class='wp_keywordlink_affiliate'><a href="http://lxy.me/tag/考试" title="查看 考试 中的全部文章" target="_blank">考试</a></span>";
    var now = new Date();
    var date = timedate.getTime() - now.getTime();
    var time = Math.floor(date / (1000 * 60 * 60 * 24));
    if (time >= 0) ;
    document.write("<li><font color=#DEDBDE>现在离2013年" + times + "还有: <font color=red><b>" + time + "</b></font> 天</font></li>");
</Script>  

4.复杂版倒计时，带毫秒

<script language="JavaScript" type="text/javascript">
    function d<span class='wp_keywordlink_affiliate'><a href="http://lxy.me/tag/js" title="查看 js 中的全部文章" target="_blank">js</a></span>() {
        var urodz = new Date("11/12/2008");
        var now = new Date();
        var num
        var ile = urodz.getTime() - now.getTime();
        var dni = Math.floor(ile / (1000 * 60 * 60 * 24));
        if (dni > 1)
            num = dni + 1
        else
        if (dni == 1)
            num = 2
        else
        if (dni == 0)
            num = 1
        else
            num = 0
        document.write(num)
    }
</script>

距某某开幕式还有 [
<script language="JavaScript" type="text/javascript">d<span class='wp_keywordlink_affiliate'><a href="http://lxy.me/tag/js" title="查看 js 中的全部文章" target="_blank">js</a></span>()</script>] 天
第五个：Javascript倒计时器 - 采用系统时间自校验
这次利用系统时间自校验倒计时, 无需手工调校使得倒计时更为精确, 代码及详细注释如下:

<span id="clock">00:01:11:00</span>
<input id="startB" type="button" value="start countdown!" onclick="run()">
<input id="endB" type="button" value="stop countdown!" onclick="stop()">
<br>
<input id="diff" type="text">
<input id="next" type="text">
<script language="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>