JavaScript倒數計時

隨便啦_發表於2019-02-28
 <h3 id="countDate"></h3>
  <script>
    function countTime(targetDate) {
      // 獲取當前時間物件
      var now = new Date()
      // 將目標時間字串 格式化成 目標時間物件
      var target = new Date(targetDate)

      // 計算毫秒差
      var diffTime = target - now

      // 如果目標時間 小於 當前時間
      if(diffTime <= 0) {
        window.clearInterval(timerID)
        alert('本期活動已結束,敬請期待下次~')
        return '本期活動已結束,敬請期待下次~'
      }

      // 將毫秒 轉換成 秒
      diffTime = Math.floor(diffTime / 1000)

      // 一天需要的秒數
      var d =  60 * 60 * 24

      // 一小時需要的秒數
      var h = 60 * 60

      // 將秒數換算成天
      var day = Math.floor(diffTime / d)

      // 換算成天后 剩下的秒數
      diffTime %= d // diffTime = diffTime % d

      // 將秒數換算成小時
      var hour = Math.floor(diffTime / h)

      // 換算成小時 後 剩下的秒數
      diffTime %= h

      // 將秒數換算成分鐘
      var minutes = Math.floor(diffTime / 60)

      // 秒數
      var seconds = diffTime % 60

      return `倒數計時:${day}${hour}小時${minutes}${seconds}秒`
    }

    var countDate = document.getElementById('countDate')

    var timerID = setInterval(function() {
      countDate.innerHTML = countTime('2019/3/1 17:00:00')
    }, 1000)
  </script>
複製程式碼

相關文章