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元素的引用，该元素是一个对象。不应使用＆lt;对象进行比较。运营商。你需要：

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

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

如果支持input type date，浏览器应该成功地将字符串解析为日期，因此您可以这样做：

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

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

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

无论如何，你需要：

获取每个输入的值
检查它们是否生成有效日期
如果他们这样做，请比较日期，例如：

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中的函数声明没有参数列表，因此语法无效（在上面已修复）。

JAVASCRIPT在表单中验证日期

2 个答案: