0

我有倒数计时器,它很好。我正在尝试将其转换为 COUNT UP TIMER。我对这项任务感到困惑。

我经历了很多方法,但不是确切的答案。

HTML 代码

<div class="tk_countup_time p-0 transparent_bg box_shadow_none animation" data-animation="fadeInUp" data-animation-delay="1.2s" data-time="2025/02/28 00:00:00"></div>

jQuery 代码

$('.tk_countup_time').each(function() {
        var endTime = $(this).data('time');
        $(this).countdown(endTime, function(tm) {
            $(this).html(tm.strftime('<span class="counter_box"><span class="tk_counter days">%D </span><span class="tk_text">Days</span></span><span class="counter_box"><span class="tk_counter hours">%H</span><span class="tk_text">Hours</span></span><span class="counter_box"><span class="tk_counter minutes">%M</span><span class="tk_text">Minutes</span></span><span class="counter_box"><span class="tk_counter seconds">%S</span><span class="tk_text">Seconds</span></span>'));
        });
    });
4

1 回答 1

0

假设您使用的是 jQuery 倒计时,您可以设置elapse:true使其在达到零后继续计数,而不是将完成时间设置为当前日期,因此它立即开始计数。

let now = new Date().getTime();
$('#clock').countdown(now, {elapse: true})
.on('update.countdown', function(event) {
  var $this = $(this);
  $this.html(event.strftime('Counting Up: <span>%H:%M:%S</span>'));
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.countdown/2.2.0/jquery.countdown.min.js"></script>
<div id="clock"></div>

于 2019-12-15T02:41:03.373 回答