JavaScript 倒计时

1. 指定时间戳倒计时

    /**
     * timestamp: 时间戳:毫秒级
     */
    function countDown(timestamp) {
      var nowDate = +new Date()
      var inputDate = parseInt((nowDate - timestamp) / 1000) // 差值转换为s

      var timer = setInterval(() => {
        inputDate -= 1

        if (inputDate < 0) {
          clearInterval(timer)
          return
        }

        var d = parseInt(inputDate / 3600 / 24) // 天
        var h = parseInt(inputDate / 60 / 60 % 24) // 小时
        var m = parseInt(inputDate / 60 % 60) // 分
        var s = parseInt(inputDate % 60) // 秒

        d = d < 10 ? '0' + d : d
        h = h < 10 ? '0' + h : h
        m = m < 10 ? '0' + m : m
        s = s < 10 ? '0' + s : s

        // 这一部分为页面显示赋值
        day.innerHTML = d
        hour.innerHTML = h
        min.innerHTML = m
        sec.innerHTML = s
      }, 1000)
    }

    var inputDate = 60 * 24 * 3600 * 1000 // 输入天数的毫秒值

    // 这个地方是为了传入一个时间戳
    countDown(+new Date() - inputDate)

2. 指定天数倒计时

    /**
     * 指定天数倒计时
     * days: 天数
     */
    function countDown(days) {
      var inputDate = days * 24 * 3600 // 输入天数的秒值

      var timer = setInterval(() => {
        inputDate -= 1

        if (inputDate < 0) {
           clearInterval(timer)
           return
        }

        var d = parseInt(inputDate / 3600 / 24) // 天
        var h = parseInt(inputDate / 60 / 60 % 24) // 小时
        var m = parseInt(inputDate / 60 % 60) // 分
        var s = parseInt(inputDate % 60) // 秒

        d = d < 10 ? '0' + d : d
        h = h < 10 ? '0' + h : h
        m = m < 10 ? '0' + m : m
        s = s < 10 ? '0' + s : s

        // 这一部分为页面显示赋值
        day.innerHTML = d
        hour.innerHTML = h
        min.innerHTML = m
        sec.innerHTML = s
      }, 1000)
    }

    countDown(2)

上一篇:基础语法js


下一篇:js+html+css+jQuery实现简单购物车