连续计数器中的数字格式问题

Question

出于某种原因，我的连续计数器正确显示了初始起始数字“65,000”，带有千位分隔符，但之后它无法在每次计数时将 200 增量添加到起始数字。我想看的是

65,000, 65,200, 65,400, etc

我怀疑我仍在错误地使用我的千位分隔符格式化函数 'numberWithCommas'。我试图从代码中的许多其他地方调用它，但没有任何效果。我也对如何将以前的帖子改编成这段代码感到困惑。在这里超出我的深度。谁能帮忙？ https://jsfiddle.net/cs6hL4jy/

$(document).ready(function() {

  var StartNowTonnes = 6500000
  var timeVal = StartNowTonnes;

  $('.timer').html(timeVal);
  refreshTimer(); // Load timer function

  var timerInterval = 1000;
  var loadTimer = setInterval(refreshTimer, timerInterval);
});

//----------------------------

// FUNCTION Refresh Timer
function refreshTimer() {
  // Set counter
  setTimeout(function() {
    // Get timer value
    var myTime = parseInt($('.timer').html()) + 5;

    // If timer has not reached 0
    if (myTime > 0) {

      //$('.timer').html(myTime);
      var myTimeWithComma = numberWithCommas(myTime);
      $('.timer').html(myTimeWithComma);


    } else {
      $('.timer').html('Time up!');
    }
  }, 1);

}

//--------

function numberWithCommas(number) {
  var parts = number.toString().split(".");
  parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  return parts.join(".");
}

.timer {
  background: #d2d8e8;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="timer"></div>

Answer 1

您不应将页面中的当前值读回到变量中。而是将值保存在内存中（即保持 state）。您当前的问题是 parseInt 不会像您期望的那样解释数字。但是，如果您不依赖于解析该数字，那么该问题就变得无关紧要了。您自己生成了它，因此请跟踪它。还有：

您不需要 setInterval 和 setTimeout
很奇怪，你增加这个数字，还像倒计时一样检查这个数字是否为正。
您的代码递增 5，而不是 200
评论可能会有帮助，但要避免添加根本不包含任何信息的评论。像“// FUNCTION Refresh Timer”真的没有告诉任何有用的东西。

$(document).ready(function() {
  var state = {
      timerInterval: 1000,
      myTime: 6500000,
      increment: 200
  };

  refreshTimer(state);
});

function refreshTimer(state) {
    var myTimeWithComma = numberWithCommas(state.myTime);
    $('.timer').html(myTimeWithComma);
    
    // If timer has not reached 0
    if (state.myTime > 0) {
        state.myTime += state.increment;
        setTimeout(() => refreshTimer(state), state.timerInterval);
    } else {
        $('.timer').html('Time up!');
    }
}

//--------

function numberWithCommas(number) {
  var parts = number.toString().split(".");
  parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  return parts.join(".");
}

.timer {
  background: #d2d8e8;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="timer"></div>

连续计数器中的数字格式问题

Number format issue in continuous counter

jquery

counter