js 發送短信倒計時、秒殺倒計時實現代碼

時間 2019-12-05

原文原文鏈接

<!doctype html>
      <html>
        <head>
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
          <title>發送短信倒計時DEMO</title>
          <script src="jquery.min.js"></script>
        </head>
        <body style="padding:20px;">
          <span class="djs">clike me </span>
        </body>
        
        <script>
            var status = 1
            var seconds = 10
            var timeInterval
            function timeover(){
                $(".djs").html(seconds + "秒")
                seconds--
                if (seconds < 0) {
                    status = 1
                    seconds = 10
                    clearInterval(timeInterval)
                    $(".djs").html("clike me")
                }
            }
            $(function(){
                $(".djs").click(function(){
                    if(status == 0){
                        // 正在處理 - 鎖定階段 
                        return
                    }
                    status = 0
                    timeInterval = setInterval("timeover()", 1000)
                })
            })
        </script>
      </html>

<!doctype html>
      <html>
        <head>
          <meta charset="utf-8">
          <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
          <title>秒殺倒計時</title>
          <script src="jquery.min.js"></script>
        </head>
        <body style="padding:20px;">
          <span class="showtime"> </span>
        </body>
        
        <script>
             // 當天0點
            var zerotime = new Date(new Date().toLocaleDateString()).getTime()
            // 當天11點
            var time1 = zerotime + 11 * 60 * 60 * 1000 - 1;
            // 當天15點
            var time2 = zerotime + 15 * 60 * 60 * 1000 - 1;
            // 當天20點
            var time3 = zerotime + 20 * 60 * 60 * 1000 - 1;
            // 次日11點
            var time4 = zerotime + 34 * 60 * 60 * 1000 - 1;
            var currenttime
            var lefttime = 0
            
            setInterval("timeover()", 1000)
            
            function timeover(){
                currenttime = new Date().getTime()
                if(currenttime < time1) {
                    lefttime = time1 - currenttime
                } else if(currenttime < time2) {
                    lefttime = time2 - currenttime
                } else if(currenttime < time3) {
                    lefttime = time3 - currenttime
                } else if(currenttime < time4) {
                    lefttime = time4 - currenttime
                }
                lefttime = lefttime/1000
                var result = formatSeconds(lefttime)
                
                $(".showtime").html(result[0] + ":" + result[1] + ":" + result[2])
            }
            
            function formatSeconds(value) {
                var secondTime = parseInt(value);// 秒
                var minuteTime = 0;// 分
                var hourTime = 0;// 小時
                if(secondTime > 60) {//若是秒數大於60，將秒數轉換成整數
                    //獲取分鐘，除以60取整數，獲得整數分鐘
                    minuteTime = parseInt(secondTime / 60);
                    //獲取秒數，秒數取佘，獲得整數秒數
                    secondTime = parseInt(secondTime % 60);
                    //若是分鐘大於60，將分鐘轉換成小時
                    if(minuteTime > 60) {
                        //獲取小時，獲取分鐘除以60，獲得整數小時
                        hourTime = parseInt(minuteTime / 60);
                        //獲取小時後取佘的分，獲取分鐘除以60取佘的分
                        minuteTime = parseInt(minuteTime % 60);
                    }
                }
                
                var array = []
                
                var hour = parseInt(hourTime) > 9 ? parseInt(hourTime) : "0"+parseInt(hourTime)
                var minut = parseInt(minuteTime) > 9 ? parseInt(minuteTime) : "0"+parseInt(minuteTime)
                var second = parseInt(secondTime) > 9 ? parseInt(secondTime) : "0"+parseInt(secondTime)
                array.push(hour)
                array.push(minut)
                array.push(second)
                return array;
            }
            
            
            
        </script>
      </html>