如何检查 datetime-local 输入字段不小于其他 datetime-local 字段答案

【问题标题】：How to check datetime-local input field is not less than other datetime-local field如何检查 datetime-local 输入字段不小于其他 datetime-local 字段
【发布时间】：2017-12-18 17:59:29
【问题描述】：

我正在创建一个表单，我在其中使用 datetime-local 来输入 2 个输入字段 - StartDate 和 EndDate。

如何确保 EndDate 不小于 StartDate。我在 JS 下面写了，但它无法选择日期/甚至点击页面的提交按钮。

请提供建议，感谢您抽出宝贵时间阅读本文:)

function checkDate() {
  var dateString = document.getElementById('StartDate').value;
  var dateString2 = document.getElementById('EndDate').value;
  var DateStart = new Date(dateString);
  var DateEnd = new Date(dateString2);
  if (DateEnd > DateStart) {
    alert("End date cannot be less than Start date.");
    return false;
  }
  return true;
}

<input type="datetime-local" class="form-control name_list" name="StartDate" id="StartDate" required="required" onclick="checkDate()" />
</div>
<div class="col-lg-1 mb-0">
  <h6>Deployment End *</h6>
</div>
<div class="col-lg-3 mb-0">
  <input type="datetime-local" class="form-control name_list" name="EndDate" id="EndDate" required="required" onclick="checkDate()" />
</div>

【问题讨论】：

标签： javascript jquery datetime

【解决方案1】：

使用 click 事件处理程序只会在您单击表单时激活，在您没有任何有用信息时触发。替代方案是“onchange”，当您完成输入时将触发。

<input type="datetime-local" class="form-control name_list" name="StartDate" id="StartDate" required="required" onchange="checkDate()" />
<input type="datetime-local" class="form-control name_list" name="EndDate" id="EndDate" required="required" onchange="checkDate()" />

如果您想确保您的结束日期与开始日期相比是将来的，您需要交换比较运算符。

if (DateEnd < DateStart) {
    alert("End date cannot be less than Start date.");
    return false;
}
  return true;

【讨论】：