【问题标题】:Javascript Countdown VariableJavascript 倒计时变量
【发布时间】:2020-07-24 01:16:32
【问题描述】:

我正在尝试将日期更改为第二个日期。在第一次约会时,我希望它显示 Starts: 粗体,然后显示剩余时间。我想改成第二次约会。当它更改为第二个日期时,我希望它显示 Ends: 粗体,然后显示剩余时间。当两个倒数计时器结束时,我希望它显示说明事件已结束的文本。这是我目前所拥有的。

<script>
// Set the date we're counting down to
var countDownDate = new Date("July 23, 2020 21:07:00").getTime();
var countDownDate2 = new Date("July 23, 2020 21:08:00").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get today's date and time
  var now = new Date().getTime();

  // Find the distance between now and the count down date
  var distance = countDownDate - now;
  var distance2 = countDownDate2 - now;
  var a;
if (distance < 0 && distance2 >0) {
    a = distance2; 
} else {
    a = distance;
}

  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(a / (1000 * 60 * 60 * 24));
  var hours = Math.floor((a % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((a % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((a % (1000 * 60)) / 1000);

  // Output the result in an element with id="demo"
  document.getElementById("demo").innerHTML = "Starts: " + days + "d " + hours + "h "
  + minutes + "m " + seconds + "s ";

  // Change to another exp.
  if (distance < 0 && distance2 >0) {
   function changeDate() {
   a = distance2; 
   }
  }
  
// If the count down is over, write some text 
if (distance2 < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
}}, 1000);
</script>

【问题讨论】:

  • 不清楚,你想要倒计时到第一个日期,然后当这个日期过去 (show=starts) 倒计时到第二个日期 (show=Ends),然后是秒表自第二个日期以来经过的时间?

标签: javascript countdown


【解决方案1】:

如果我理解这个问题,看来您基本上已经弄清楚了。您只需要另一个变量作为开始/结束标签,然后在设置演示元素的.innerHTML 时使用它。

<div id="demo"></div>
<script>
// Set the date we're counting down to
   
//var countDownDate = new Date("July 23, 2020 21:07:00").getTime();
var countDownDate = Date.now() + 5000; // using a shorter time for testing purposes;
// var countDownDate2 = new Date("July 23, 2020 21:08:00").getTime();
var countDownDate2 = Date.now() + 10000;

// Update the count down every 1 second
var x = setInterval(function() {

  // Get today's date and time
  var now = new Date().getTime();

  // Find the distance between now and the count down date
  var distance = countDownDate - now;
  var distance2 = countDownDate2 - now;
  var a;
  var label = 'Starts: ';
if (distance < 0 && distance2 >0) {
    a = distance2;
    label = 'Ends: ';
} else {
    a = distance;
}

  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(a / (1000 * 60 * 60 * 24));
  var hours = Math.floor((a % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((a % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((a % (1000 * 60)) / 1000);

  // Output the result in an element with id="demo"
  document.getElementById("demo").innerHTML = "<strong>" + label + "</strong>" + days + "d " + hours + "h "
  + minutes + "m " + seconds + "s ";

  // Change to another exp.
  if (distance < 0 && distance2 >0) {
   function changeDate() {
   a = distance2; 
   }
  }
  
// If the count down is over, write some text 
if (distance2 < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
}}, 1000);
</script>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-05-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多