Question

我尝试实现一个功能，当输入错误格式的日期并按下提交按钮时，该功能将显示一个警告框。我的表单中有六个日期字段。

我似乎无法找到正则表达式示例，告诉我如何在我的字段中实现该函数仅输入如何执行函数本身。我想把它限制在YYYY-MM-DD。在这里发帖是我的最后一招，我已经找了很长时间无济于事。请有人帮忙吗？

function validate_date() {
    var date_regex = /^(0[1-9]|1[0-2])\/(0[1-9]|1\d|2\d|3[01])\/(19|20)\d{2}$/ ;
    if(!(date_regex.test(testDate)))
    {
    alert('Wrong format!');
    return false;
    }
   }                

<input type="text" class="form-control" id="empexpiry" style="width:350px;" placeholder="Nothing on File" name="empexpiry" value=""

Answer 1

如果我是你，我会使用一些插件。有很好的vanilla和jQuery插件来验证表单（例如Vanilla，jQuery）。

但如果你想自己做：

收听表单的提交事件并使用正则表达式验证所有条目

要验证的功能可能是这样的

function isDateValid (dateStr) {
  let isValid = dateStr.match(/[0-9]{4}-[0-9]{2}-[0-9]{2}/)

  if (!isValid) return false

  const dateObj = new Date(dateStr);
  isValid = dateObj != 'Invalid Date'

  return isValid
}

你听取提交的功能可能是这样的：

function validateForm (e) {

   const input1 = document.getElementById("input1").text

   if (!isDateValid(input1)) {
     alert('invalid')
     e.preventDefault()
     return false
   }

   /* And so on */
}

Answer 2

我发现HTML5模式属性就是所需要的。简单！

<input id="date" type="text" pattern="\d{4}-\d{1,2}-\d{1,2}" oninvalid="setCustomValidity('Please make sure the date follows this format: YYYY-MM-DD')" required="required"/>

如何在日期字段中限制日期格式

2 个答案: