需要将新日期与日期选择器进行比较

Question

我正在努力处理 javascript 中的日期。我将比较一些输入的日期，但用户和用户输入的日期取决于信息所在的列表。我的问题是比较系统日期和日期选择器日期。系统日期显示格式为“Tue Dec 22 2015 00:00:00 GMT+0000 (GMT)”日期选择器显示 22/12/2015。如何更改系统日期以匹配日期选择器格式，以便我可以比较日期？我想在没有 jQuery 的情况下做到这一点（我知道日期选择器违背了这一点）。

这是迄今为止我的日期代码，基本上只是将时间设置为 00:00:00。

var today = new Date();
today.setHours(0,0,0,0);

var yesterday = new Date();
yesterday.setDate(yesterday.getDate() - 1);
yesterday.setHours(0,0,0,0);

var tomorrow = new Date();
tomorrow.setDate(tomorrow.getDate() + 1);
tomorrow.setHours(0,0,0,0);

console.log(today);


var dateTask = document.getElementById("date").value;

    console.log(dateTask);

Answer 1

您必须将用户输入解析为

Date

对象。

22/12/2015

不是

Date

构造函数的有效日期字符串，因此您必须自己解析它。 你可以做这样的事情：

const [day, month, year] = document.getElementById("date").value.split('/');
const dateTask = new Date(year, month - 1, day, 0, 0, 0, 0);

注意：此代码非常基础，在解析真实用户输入时需要增强。

之后您可以像这样比较日期：

today.getTime() === dateTask.getTime()

Answer 2

如果您想要一个日期选择器，实际上并不需要 JQuery，但这不是重点。我认为最好的方法是使用 Date.parse 将用户输入解析为日期。然后您可以将它们与 unix 纪元时间戳进行比较。

"use strict";
var datePicker = document.querySelector('#date');
datePicker.addEventListener('change',function(){

  var udate = Date.parse(this.value);
  var sysdate = Date.now();
  document.querySelector('#d').innerText = udate;
  document.querySelector('#sys').innerText = sysdate;

});

form {
  position: relative;
}
label, input, output {
  float: left;
}
label {
  clear: left;
  width: 128px;
}

<form>
  <label for="date">user input</label>
  <input type="date" name="date" id="date">
  <label for="d">user date</label>
  <output id="d" name="d" for="date"></output>
  <label for="sys">system date</label>
  <output id="sys" name="sys"></output>
</form>

Answer 3

只需用 str.split("/"); 分割字符串即可并以此处指出的方式之一构造日期。

https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Date

注意月份是从 0-11

Answer 4

const datePicker = document.querySelector("#date");
const todayDate = new Date().toLocaleDateString();
const datePickerValue = new Date(datePicker.value).toLocaleDateString();

datePicker.addEventListener("change", () => {
  if (datePickerValue === todayDate) {
    alert("");
  } else {
    alert("");
  }
});