Question

我一直在寻找一个从特定日期开始运行的计时器，但是我使用的代码似乎只显示了前15年的时间长度，而且没有再回来了？这是一个非常简单的概念，我无法开始工作，像2001年1月12日这样的日期很好，但是低于1999年的任何一个似乎没有效果，而且日期限制了5440 ......

window.onload=function() {
  // Month,Day,Year,Hour,Minute,Second
  upTime('oct,01,0000,00:00:00'); // ****** Change this line!
}

function upTime(countTo) {
  now = new Date();
  countTo = new Date(countTo);
  difference = (now-countTo);

  days=Math.floor(difference/(60*60*1000*24)*1);
  hours=Math.floor((difference%(60*60*1000*24))/(60*60*1000)*1);
  mins=Math.floor(((difference%(60*60*1000*24))%(60*60*1000))/(60*1000)*1);
  secs=Math.floor((((difference%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1);

  document.getElementById('days').firstChild.nodeValue = days;
  document.getElementById('hours').firstChild.nodeValue = hours;
  document.getElementById('minutes').firstChild.nodeValue = mins;
  document.getElementById('seconds').firstChild.nodeValue = secs;

  clearTimeout(upTime.to);
  upTime.to=setTimeout(function(){ upTime(countTo); },1000);
}

#countup p {
  display: inline-block;
  padding: 5px;
  background: #FFA500;
  margin: 0 0 20px;
}

<div id="countup">
  It's been
  <p id="days">00</p>
  <p class="timeRefDays">days</p>
  <p id="hours">00</p>
  <p class="timeRefHours">hours</p>
  <p id="minutes">00</p>
  <p class="timeRefMinutes">minutes</p>
  <p id="seconds">00</p>
  <p class="timeRefSeconds">second</p>
</div>

Answer 1

编辑：

我改进了代码段并添加了其他信息和链接。

问题是如何设置Date()对象。转到here查看不同的有效选项。

在您的情况下，您想要做的是：

var countTo = new Date(year, month, day, hours, minutes, seconds);

但是你只传递一个参数，在这种情况下，它应该是指定日期和1970年1月1日午夜之间UCT的毫秒数。

此外，您可以先创建Date()对象，然后分别设置不同的时间单位。执行此操作时，您必须使用setFullYear。我在答案的第一版中使用了setYear，这显然是错误的：它不仅是过时的，而且还会导致0-99范围内的意外结果（正如OP对此评论中指出的那样）回答）。

我已经清理了我的代码段，使其对其他人也很有用：

＆＃13;

//we get a reference to the input elements
var i_year = document.getElementById('i_year');
var i_month = document.getElementById('i_month');
var i_day = document.getElementById('i_day');
var i_hours = document.getElementById('i_hours');
var i_minutes = document.getElementById('i_minutes');
var i_seconds = document.getElementById('i_seconds');
var button = document.getElementById('start_counting');

//we declare a new date, it will be the default value
var start_time = new Date();

//counting starts!
setInterval(function() {
  upTime();
}, 1000);

function upTime() {
  //if the inputs have any value, we update start_time
  if (i_year.value) start_time.setFullYear(i_year.value);
  //Months go from 0 to 11, so we substract 1
  if (i_month.value) start_time.setMonth(i_month.value - 1);
  if (i_day.value) start_time.setDate(i_day.value);
  if (i_hours.value) start_time.setHours(i_hours.value);
  if (i_minutes.value) start_time.setMinutes(i_minutes.value);
  if (i_seconds.value) start_time.setSeconds(i_seconds.value);

  //difference between both dates in ms
  var difference = (new Date() - start_time);

  var msSecond = 1000;
  var msMinute = 60 * msSecond;
  var msHour = 60 * msMinute;
  var msDay = 24 * msHour;

  var days = Math.floor(difference / msDay);
  difference -= days * msDay;

  var hours = Math.floor(difference / msHour);
  difference -= hours * msHour;

  var minutes = Math.floor(difference / msMinute);
  difference -= minutes * msMinute;

  var seconds = Math.floor(difference / msSecond);

  //updating the counter with the new values
  document.getElementById('days').firstChild.nodeValue = days;
  document.getElementById('hours').firstChild.nodeValue = hours;
  document.getElementById('minutes').firstChild.nodeValue = minutes;
  document.getElementById('seconds').firstChild.nodeValue = seconds;

}

＆＃13;

#countup p {
  display: inline-block;
  padding: 5px;
  background: #FFA500;
  margin: 0 0 20px;
}

#target_date input {
  display: inline-block;
  width: 50px;
  margin-bottom: 10px;
}

＆＃13;

<div id="target_date">
  <input type="text" id="i_year" placeholder="Year">
  <input type="text" id="i_month" placeholder="Month">
  <input type="text" id="i_day" placeholder="Day">
  <input type="text" id="i_hours" placeholder="Hours">
  <input type="text" id="i_minutes" placeholder="Minutes">
  <input type="text" id="i_seconds" placeholder="Seconds">
</div>
<hr>

<div id="countup">
  It's been
  <p id="days">0</p>
  <p>days</p>
  <p id="hours">0</p>
  <p>hours</p>
  <p id="minutes">0</p>
  <p>minutes</p>
  <p id="seconds">0</p>
  <p>second</p>
</div>

＆＃13;

日期对象支持的年份范围大约是1970年前后的285，616年。这是由于ECMAScript Date对象支持的实际时间范围。关于它，请阅读here和here。

最后一件事。如果你深入研究这个主题，你会发现评论javascript处理日期之间差异的方式。并非所有情况都是正确的（例如，您可以在javacript 中查看闰年代码片段）。但如果您需要完全准确的结果，那么回溯数千年后将会出现问题。不仅仅是因为技术方面，还因为人类（历史，时区，夏令时等日历变化）。

这种计算有javascript特定的库。我认为Moment.js是最受欢迎的一种。

希望它有所帮助！

如何在JavaScript中计算很长一段时间？

1 个答案: