HTML先前日期验证

Question

即时通讯与我的代码有问题。 我想要这样，如果用户要选择昨天或以前的任何日期，则应在警告框中告诉用户＃请输入一个空档日期'

当我选择昨天的日期时，它会给我警报消息。 当我选择今天的日期时，它会给我一条警报消息。 当我选择明天的日期时，它会给我警报消息。

选择今天的消息后，为什么会向我发出警报消息？

<input type='date' onchange="validateDate()" id='mydate'></input>

<script>

    function validateDate() {
    var userdate = new Date(document.getElementById("mydate").value);
    var today = new Date();

       if(userdate < today){

            alert('Your message');
       }
}
</script>

Answer 1

这是因为日期输入仅设置日期本身，而将小时，分钟和秒保留为00:00:00。 因此，包含该附加数据的new Date()的输出将始终大于当前日期的日期输入的输出。

为了克服这个问题，您可以使用其他值来反映今天的时间，例如，来自日期输入的值将仅包含年，月，日和时区偏移量。

内容如下：

var today = new Date();
var todayForComparison = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 0, -today.getTimezoneOffset());

现在，在您的if语句中使用“ todayForComparison”，而不是原始的“ today”变量。

Answer 2

由new Date(document.getElementById("mydate").value)返回的new Date(document.getElementById("mydate").value)时间为00:00 。 这就是为什么当您选择今天的日期时，您可以看到警报。

Answer 3

您正在将日期与空时间（00:00）和完整的dateTime（xx：xx）进行比较。 您应该在比较日期之前删除dateTime。

Answer 4

演示
首先将用户价值，日期格式和使用的getTime（）函数来比较也有很多方法更好，然后这一点，最好的，你可以使用moment.js

 var userDate = new Date(document.getElementById("mydate").value);
    var today = new Date();
    if (today.getTime()>userDate.getTime()) {
        alert("invalid date");
    }

Answer 5

这是小提琴 ，我从js添加了一个事件监听器：

var el = document.getElementById("mydate");
el.onchange = onChangeDate;

function onChangeDate(e){
    if(new Date(el.value) < new Date()){
        alert("invalid date");
    }
}