禁止用户在不禁用日期选择器文本框的情况下在文本框中输入无效的日期格式

Question

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

例如：我使用的是mm/dd/yy格式，用户在mm列中不能键入超过12的内容，在日期列中应根据月份(30/31/28(填写，依此类推

我尝试过使用日期选择器类的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"/>