javascript - 如何验证输入日期 html 年份？

Question

我希望日期输入在年份有 4 位数字后停止输入。我尝试使用 HTML 中的 min 和 max 组件，但它仍然允许您键入删除第一个数字。参见示例 1。

请参阅示例 2 以了解可以输入超过 4 位数字的年份。

这是我的两次测试运行，我还尝试使用 HTML 中的“onchange”组件使用 JS 创建一个方法，我尝试过，但是这些似乎都不起作用...

https://fiddle.jshell.net/jaelsvd/98xww3qg/9/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>Example 1</label>
 <input id="date1" type="date" min="1990-12-31" max="2050-12-30">
  <br />
   <label>Example 2</label>
  <input id="date2" type="date" />

Answer 1

设置 maxlength 并使用 pattern 和 required 如果你想要 html5 内置验证:

<form>
  <label for ="date2">Example 2</label>
  <input id="date2" type="date" pattern="\d{4}" maxlength="4"  required />
  <button>
    Submit
  </button>
</form>