0

我问了一个类似的问题，但没有收到。所以我会重新措辞。为什么flipClock 函数getTime() 没有在每次钟面变化时返回一个值？当我将其输出到控制台时，该值始终保持在 10。它永远不会倒计时。然而，时钟工作得很好。如何获取时钟的当前时间？

var clock;

  // Instantiate a counter
  clock = new FlipClock($('.clock'), 10, {
    clockFace: 'MinuteCounter',
    autoStart: false,
    countdown: true
  });

if(clock.getTime() == 0){
   //Redirect to another page
   window.location.href = "example.html";
}else{
 console.log("This is the time now" + getTime());
}
4

2 回答 2

1

如果我误解了你的问题，请原谅我。如果这个答案离题和傲慢，我道歉。

您提供的代码只会执行一次。创建时钟后，您立即调用clock.getTime(). 在那一刻，结果将是 10。因此，您的重定向代码将不会执行（因为结果不等于 0），您将立即进入else块内的代码。该代码会将时钟的当前时间注销到控制台（仍然是 10，因为代码执行得如此之快）。

为了观察时钟倒计时，您需要反复调用clock.getTime(). 您应该阅读轮询的概念。您可能会发现setInterval有用（请参阅https://alligator.io/js/settimeout-setinterval/）。

于 2018-11-22T20:34:15.900 回答
1

因为你调用它一次，它需要绑定到interval事件。在回调函数中创建它

var clock = new FlipClock($('.clock'), 10, {
  clockFace: 'MinuteCounter',
  autoStart: true,
  countdown: true,
  callbacks: {
    interval: function() {
      var time = this.factory.getTime().time;
      console.clear()
      console.log("Countdown now: " + time);
      if (time == 0) {
        alert('Countdown finished!');
      }
    }
  }
});
.clock{margin-top:30px}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/flipclock/0.7.8/flipclock.min.js"></script>


<div class="clock"></div>

于 2018-12-10T17:50:53.170 回答