JAVASCRIPT在表单中验证日期

Question

我试图用javascript来验证日期输入是否正确。 例如，对于ETA（估计到达时间），日期应早于ETD（估计时间离开）。

这是形式：

   <form>
      <label>ETA</label>
             <input  id="etadate" name="etadate" type="date" />
             <input name="etatime" type="time"/> 
      <label>ETD</label>
             <input  id="etddate" name="etddate" type="date"/>
             <input name="etddime" type="time"/>                                                                                        
   </form>

而对于javascript：

function validate1
 {
       var x = document.getElementById("etadate");
       var y = document.getElementById("etddate");

       if (x < y)
       {
          true;
       }
       else
       {
          false;
       }
}

当我试图运行代码时，它没有通知用户eta的日期应早于etd。 我不知道在哪里调整，所以代码运行正常。

Answer 1

像这样使用 -

function validate1
{
   var x = new Date(document.getElementById("etadate").value);
   var y = new Date(document.getElementById("etddate").value);

   return x<y;
}

Answer 2

有几个问题：

var x = document.getElementById("etadate");

将返回对input元素的引用，该元素是一个对象。 不应使用<运算符比较对象。 你需要：

var x = document.getElementById("etadate").value;

所以x现在是一个字符串。

在支持输入类型日期的情况下，浏览器应该成功地将字符串解析为日期，因此您可以执行以下操作：

var x = new Date(document.getElementById("etadate").value);

但是，在某些浏览器中，返回的字符串是ISO 8601格式的字符串，如2016-05-23，它将被解析为UTC，因此对于GMT以西的人来说，它似乎是提前一天。 你需要处理这个问题。

然后有些浏览器不支持输入类型日期，有关于此的问题。

无论如何，你需要：

1. 获取每个输入的值
2. 检查它们是否生成有效日期
3. 如果他们这样做，请比较日期，如下所示：

 function validate1 (form) { var x = new Date(form.etadate.value); var y = new Date(form.etddate.value); if (isNaN(+x) || isNaN(+y)) { alert("One of the dates is invalid"); return false; } if (x < y) { alert('ETA is before ETD'); } else { alert('ETD is before ETA'); } } 

 <form onsubmit="validate1(this); return false;"> <label>ETA</label> <input id="etadate" name="etadate" type="date"> <input name="etatime" type="time"/> <label>ETD</label> <input id="etddate" name="etddate" type="date"> <input name="etdtime" type="time"> <button>submit</button> </form> 

我已经使用return false阻止了提交，自然函数和监听器应该返回true或false，具体取决于比较的结果。

此外，OP中的函数声明没有参数列表，因此语法无效（在上面已修复）。