Javascript 循环倒数计时器

Question

function timer()

{
 var currentTime = new Date()
 var hours = currentTime.getHours()
 var minutes = currentTime.getMinutes()
 var seconds = currentTime.getSeconds()

 if (minutes < 10)
 {
  minutes = "0" + minutes
 }
 
 if (hours < 6)
 {
  var hoursLeft = 5 – hours;
  var minsLeft = 60 – minutes;
  
  if(minsLeft==60)
  {
   minsLeft=0;
   hoursLeft++;
  }
 var secsLeft = 60 – seconds;
 
  if(secsLeft==60)
  {
   secsLeft=0;
   minsLeft++;
  }
 }

 else if (hours < 18)
 {
  var hoursLeft = 17 – hours;
  var minsLeft = 60 – minutes;
  
  if(minsLeft==60)
  {
   minsLeft=0;
   hoursLeft++;
  }

  var secsLeft = 60 – seconds;
  
  if(secsLeft==60)
  {
   secsLeft=0;
      minsLeft++;
  }
 }
 
 else if (hours < 24)
 {
  var hoursLeft = 29 – hours;
  var minsLeft = 60 – minutes;
  
  if(minsLeft==60)
  {
   minsLeft=0;
   hoursLeft++;
  }
  
  var secsLeft = 60 – seconds;
  
  if(secsLeft==60)
  {
   secsLeft=0;
   minsLeft++;
  }
 }
 
 else if (hours == 6)
 {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.open("reset.html", true);
  xmlhttp.send();
 }
 
 else if (hours == 18)
 {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.open("reset.html", true);
  xmlhttp.send();
 }
 
 else
 {
  document.write("Error, please contact admin");
 }

 document.getElementById('timerUpFront').innerHTML= hoursLeft + " hours " + minsLeft + " minutes " + secsLeft + " seconds";
}

 var countdownTimer = setInterval('timer()', 1000);

#timerUpFront
{
 color:#009DE3;
}

#timer
{
  font-family: "Comic Sans MS", cursive, sans-serif;
  margin-top: 20px;
  font-size:36px;
  text-align:center;
}

#button
{
 background-color:#008CFF;
 font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
 font-size:26px;
 width:160px;
 padding: 10px;
 margin: 2em auto;
 margin-top: 10px;
}

<html>
<head>
<title>Timer</title>
</head>

<body>
<div id="timer">
<span id="timerUpFront"></span>
<br><br>
<div id="button">
<center><a href="reset.html" style="text-decoration:none">Reset</a></center>
</div>
</div>
</body>
</html>

正在尝试创建一个自动倒计时计时器，一旦达到 0:00:00 或按钮被按下但不会在页面刷新时自动重置。我已经尝试了几个小时，但无法显示计时器，在我自己显示的 .js 文件中找不到任何错误。正如我最后的选择不得不在这个网站上询问。

Answer 1

我不确定是不是有人恶作剧你什么的，但你使用的是更大的破折号（我不确定那叫什么），而不是常规的减号。我用 -.

替换了 –

function timer()

{
 var currentTime = new Date()
 var hours = currentTime.getHours()
 var minutes = currentTime.getMinutes()
 var seconds = currentTime.getSeconds()

 if (minutes < 10)
 {
  minutes = "0" + minutes
 }
 
 if (hours < 6)
 {
  var hoursLeft = 5 - hours;
  var minsLeft = 60 - minutes;
  
  if(minsLeft==60)
  {
   minsLeft=0;
   hoursLeft++;
  }
 var secsLeft = 60 - seconds;
 
  if(secsLeft==60)
  {
   secsLeft=0;
   minsLeft++;
  }
 }

 else if (hours < 18)
 {
  var hoursLeft = 17 - hours;
  var minsLeft = 60 - minutes;
  
  if(minsLeft==60)
  {
   minsLeft=0;
   hoursLeft++;
  }

  var secsLeft = 60 - seconds;
  
  if(secsLeft==60)
  {
   secsLeft=0;
      minsLeft++;
  }
 }
 
 else if (hours < 24)
 {
  var hoursLeft = 29 - hours;
  var minsLeft = 60 - minutes;
  
  if(minsLeft==60)
  {
   minsLeft=0;
   hoursLeft++;
  }
  
  var secsLeft = 60 - seconds;
  
  if(secsLeft==60)
  {
   secsLeft=0;
   minsLeft++;
  }
 }
 
 else if (hours == 6)
 {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.open("reset.html", true);
  xmlhttp.send();
 }
 
 else if (hours == 18)
 {
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.open("reset.html", true);
  xmlhttp.send();
 }
 
 else
 {
  document.write("Error, please contact admin");
 }

 document.getElementById('timerUpFront').innerHTML= hoursLeft + " hours " + minsLeft + " minutes " + secsLeft + " seconds";
}

 var countdownTimer = setInterval('timer()', 1000);

#timerUpFront
{
 color:#009DE3;
}

#timer
{
  font-family: "Comic Sans MS", cursive, sans-serif;
  margin-top: 20px;
  font-size:36px;
  text-align:center;
}

#button
{
 background-color:#008CFF;
 font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
 font-size:26px;
 width:160px;
 padding: 10px;
 margin: 2em auto;
 margin-top: 10px;
}

<html>
<head>
<title>Timer</title>
</head>

<body>
<div id="timer">
<span id="timerUpFront"></span>
<br><br>
<div id="button">
<center><a href="reset.html" style="text-decoration:none">Reset</a></center>
</div>
</div>
</body>
</html>

Javascript 循环倒数计时器

Javascript loop countdown timer

javascript

countdowntimer