javascript - 如何在计时器中使用秒

Question

我正在开发一个有关出价的网站，并且为此使用倒计时器，如果我有日期格式，倒计时可以正常工作

$this.html(event.strftime('%D días %H:%M:%S'));

我在数据库中有一个数字，例如:120秒

如何更改格式以获取秒？如果我只输入 %S ，他倒计时不起作用。

                    <script src="{{ URL::asset('js/jquery.countdown.js') }}" type="text/javascript"></script>   
                <script src="{{ URL::asset('js/jquery.countdown.min') }}" type="text/javascript"></script>   

<script type="text/javascript">
     $('[data-countdown]').each(function() {
       var $this = $(this), finalDate = $(this).data('countdown');
       $this.countdown(finalDate, function(event) {
         $this.html(event.strftime('%D días %H:%M:%S'));
       });
    });
</script>

更新2

代码工作正常，但我只能显示一个计时器，因为它是一个 ID，我需要与 .class 一起使用。

我将 document.getElementByID 更改为 document.getElementByClassName 但不起作用。

<script type="text/javascript">
            function dateToHHMMSS(date) {
          var hours   = date.getHours() - 1;
          var minutes = date.getMinutes();
          var seconds = date.getSeconds();
          if (hours   < 10) {hours   = "0"+hours;}
          if (minutes < 10) {minutes = "0"+minutes;}
          if (seconds < 10) {seconds = "0"+seconds;}
          return hours+':'+minutes+':'+seconds;
        }
        function countdown(count) {
          var start = new Date();
          var end = new Date(start.getTime() + (count * 1e3)); // * 1e3 to get milliseconds
          var intervalHandle = setInterval(function() {
            var current = new Date();

            var delta = new Date(end.getTime() - current.getTime());
                            $(".countdown").text(dateToHHMMSS(delta));
            if(delta.getTime() <= 0) {
              clearInterval(intervalHandle);
            $(".countdown").text(dateToHHMMSS(delta));
            }
          }, 1e3);
        }
        $('[data-countdown]').each(function() { 
            var id = $(this).attr('data-countdown');
            countdown(id);
        });
    </script>

更新3

你好，当我显示 console.log(id) 时，我可以看到收到的所有数字，但是当我使用 countdown(id) 时，我只发送最后一个 id。

 $('[data-countdown]').each(function() { 
            var id = $(this).attr('data-countdown');
            var export_data = [];
            export_data.push(id);
            $.each(export_data, function( index, value ) {
              countdown(value);
            });
        });

Answer 1

这应该可以解决问题:

function dateToHHMMSS(date) {
  var hours   = date.getHours() - 1;
  var minutes = date.getMinutes();
  var seconds = date.getSeconds();

  if (hours   < 10) {hours   = "0"+hours;}
  if (minutes < 10) {minutes = "0"+minutes;}
  if (seconds < 10) {seconds = "0"+seconds;}
  return hours+':'+minutes+':'+seconds;
}

function countdown(count) {
  var start = new Date();
  var end = new Date(start.getTime() + (count * 1e3)); // * 1e3 to get milliseconds
  var updateCountdown = function() {
    var current = new Date();
   
    var delta = new Date(end.getTime() - current.getTime());
    document.getElementById('countdown').innerHTML = dateToHHMMSS(delta);
    if(delta.getTime() <= 0) {
      clearInterval(intervalHandle);
      document.getElementById('countdown').innerHTML = "time is over";
    }
  };
  updateCountdown(); //otherwise the first second is not visible
  var intervalHandle = setInterval(updateCountdown, 1e3);
}

countdown(120); //120 or whatever value you want as long as it is in second

<div id="countdown"></div>