防止用户在 Datepicker 文本框中输入无效的日期格式而不禁用它

Question

我有一个要求，用户应该能够通过手动输入以及使用日期选择器在文本框中输入日期。我想防止用户在文本框中输入无效的日期格式。

例如：我使用mm/dd/yy格式，用户不能在mm栏输入超过12，并且在日期栏应该按照月份填写（30/31/28）等等。

我尝试过使用 datepicker 类的 constrainInput 属性，但它没有按预期工作。

$("#datepicker1").datepicker({
   constrainInput:"true",
   dateFormat:"mm/dd/yy"
});

<input type="text" id="datepicker1"/>

Answer 1

本示例使用 inputmask 和 datepicker，您可以参考：

$("#datepicker1").datepicker({
   constrainInput:"true",
   dateFormat:"mm/dd/yy"
});


var maskConfig = {
      leapday: "29-02-",
      separator: "/",
      showMaskOnHover: false,
      showMaskOnFocus: false,
      placeholder: "__/__/____"
}

$('#datepicker1').inputmask('mm/dd/yyyy',maskConfig);

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.3.4/jquery.inputmask.bundle.min.js"></script>

 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css">

<input type="text" id="datepicker1"/>