时间戳

首页 > 解决方案 > Javascript将countDown计时器更改为countUp时间

javascript - Javascript将countDown计时器更改为countUp时间

问题描述

我有这个带有内置延迟功能的倒数计时器 javascript。我需要将其更改为具有相同延迟功能的计数计时器。我知道如何在这里发布一个问题，因为这似乎并不容易接受任何事情。让我们看看这是否有效......

<script type="text/javascript">
  function pad(num, size) {
    var s = num+"";
    while (s.length < size) 
      s = "0" + s;
    return s;
  }

  function initCountdown(){
    setTimeout(function() {
      current_wait++;

      if(current_wait <= waits.length) {
        var countdowns = document.getElementsByClassName('countdown');
        for(var i = 0; i < countdowns.length; i++) {
          var number = parseInt(countdowns[i].innerHTML);
          number--;

          countdowns[i].innerHTML = pad(number, 2);
        }
        initCountdown();
      }
    }, waits[current_wait] * 1000);
  }

  var initial_number = 7;
  var waits          = [4, 24, 55]; //ADD HERE AS MANY SECONDS AS YOU DESIRE.
  var current_wait   = 0;

  var countdowns = document.getElementsByClassName('countdown');

  for(var i = 0; i < countdowns.length; i++){               
    countdowns[i].innerHTML = pad(initial_number, 2);
  }

  initCountdown();
</script>

标签： javascript

解决方案

如果您想将代码更改为向上计数，您需要做的就是将 设置initial_number为您的起始值（例如 1）并将代码number--设置为number++

一个简单计数计时器的好例子可以在最简单的 JavaScript 倒计时计时器中找到？

function pad(num, size) {
  var s = num + "";
  while (s.length < size) s = "0" + s;
  return s;
}

function initCountdown() {
  setTimeout(function() {
    current_wait++;

    if (current_wait <= waits.length) {
      var countdowns = document.getElementsByClassName('countdown');

      for (var i = 0; i < countdowns.length; i++) {
        var number = parseInt(countdowns[i].innerHTML);
        number++;

        countdowns[i].innerHTML = pad(number, 2);
      }

      initCountdown();
    }
  }, waits[current_wait] * 1000);
}

var initial_number = 1;
var waits = [4, 24, 55]; //ADD HERE AS MANY SECONDS AS YOU DESIRE.
var current_wait = 0;

var countdowns = document.getElementsByClassName('countdown');

for (var i = 0; i < countdowns.length; i++) {
  countdowns[i].innerHTML = pad(initial_number, 2);
}

initCountdown();
<div class='countdown'></div>

推荐阅读