JS关于使用2个函数比较日期的问题

问题描述 投票:0回答:2

嗨,我是Javascript的新手,所以请求naff问题道歉。这条代码返回一个Nan,它应该检索过去的天数。导致问题的第二个功能是什么?

这里是:

<body>
  <script>
    function elapsedTime(date1, date2) {
      var start = new Date(date1);
      var startMilli = start.getTime();

      var end = new Date(date2);
      var endMilli = end.getTime();

      var elapsed = (endMilli - startMilli);
      alert(millisToDaysHoursMinutes(elapsed));

    }
    function millisToDaysHoursMinutes(millis) {
      var seconds = millis / 1000;
      var totalMinutes = seconds / 60;
      var minutesPerDay = 60 * 24;
      var days  = totalMinutes / minutesPerDay;

      return days;
    }
  </script>
  <form>
    Start:<input type="text" name="date1" value="dd/m/year" /><br>
    End:  <input type="text" name="date2" value="dd/m/year" />
    <input type="button" name="button1" onclick="elapsedTime(date1.value, date2.value)" value="Get Elapsed Time" />
  </form>
</body>
javascript
2个回答
0
投票

您需要确保输入的日期有效,否则您将获得NaN(非数字)。使用input type=date并使它们成为required然后你可以在调用日期差异功能之前轻松检查它们是否有效。

例如:

function elapsedTime(date1, date2) {
  var start = new Date(date1);
  var startMilli = start.getTime();

  var end = new Date(date2);
  var endMilli = end.getTime();

  var elapsed = (endMilli - startMilli);
  alert(millisToDaysHoursMinutes(elapsed));

}

function millisToDaysHoursMinutes(millis) {
  var seconds = millis / 1000;
  var totalMinutes = seconds / 60;
  var minutesPerDay = 60 * 24;
  var days = totalMinutes / minutesPerDay;

  return days;
}
var date1 = document.querySelector("input[name=date1]"),
  date2 = document.querySelector("input[name=date2]"),
  button1 = document.querySelector("input[name=button1]");

button1.addEventListener("click", function() {
  var date1valid = date1.checkValidity();
  var date2valid = date2.checkValidity();
  if (date1valid && date2valid) {
    elapsedTime(date1.value, date2.value);
  } else {
    alert("Please provide both dates!");
  }
});
<form>
  Start:<input type="date" name="date1" required="required" value="dd/m/year" /><br> End: <input type="date" name="date2" required="required" value="dd/m/year" />
  <input type="button" name="button1" value="Get Elapsed Time" />
</form>

0
投票

您应该使用输入类型date来使您的代码工作:

<form>
    Start:<input type="date" name="date1" /><br>
    End:  <input type="date" name="date2" />
          <input type="button" name="button1" onclick="elapsedTime(date1.value, date2.value)" value="Get Elapsed Time" />
</form>
© www.soinside.com 2019 - 2024. All rights reserved.