JS時間倒計時

jopen 9年前發布 | 1K 次閱讀 JavaScript 

<html>    
    <head>    
        <title>倒計時</title>    
        <!--以下為css樣式-->    
        <style type= "text/css">    
            .daojishi h2    
            {     
                font-family:Helvetica, Microsoft YaHei, Arial, sans-serif;     
                font-size:14px;    
                margin-bottom:5px;     
                color:#151515;    
            }    
            .daojishi #timer    
            {    
                font-family:Helvetica, Microsoft YaHei, Arial, sans-serif;     
                font-size:14px;    
                color:#151515;    
                font-weight:bold;    
            }    
        </style>    
        <script type = "text/javascript" src = "timer.js">    
        </script>    
    </head>    
    <body onload = "timer()">    
        <div class = "daojishi">    
            <h2>剩余時間為：</h2>    
            <div id = "timer">    
            </div>    
        </div>    
    </body>    
</html>    

    function timer()    
                {    
                    var ts = (new Date(2018, 11, 11, 9, 0, 0)) - (new Date());//計算剩余的毫秒數    
                    var dd = parseInt(ts / 1000 / 60 / 60 / 24, 10);//計算剩余的天數    
                    var hh = parseInt(ts / 1000 / 60 / 60 % 24, 10);//計算剩余的小時數    
                    var mm = parseInt(ts / 1000 / 60 % 60, 10);//計算剩余的分鐘數    
                    var ss = parseInt(ts / 1000 % 60, 10);//計算剩余的秒數    
                    dd = checkTime(dd);    
                    hh = checkTime(hh);    
                    mm = checkTime(mm);    
                    ss = checkTime(ss);    
                    document.getElementById("timer").innerHTML = dd + "天" + hh + "時" + mm + "分" + ss + "秒";    
                    setInterval("timer()",1000);    
                }    
                function checkTime(i)      
                {      
                   if (i < 10) {      
                       i = "0" + i;      
                    }      
                   return i;      
                }

 本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！