我使用jQuery datepicker,我想用HTML5模式限制我的输入字段,如果用户不是从jQuery datepicker获取日期,而是键入日期。
如何使用HTML5模式限制用户,以便他们只需以mm/dd/yyyy
格式输入日期?
最简单的方法是使用只读属性来阻止用户直接输入:
<input class="datepicker" type="text" name="date" value="" readonly />
或者您可以使用基于模式属性的HTML5验证。日期输入模式(dd / mm / yyyy或mm / dd / yyyy):
<input type="text" pattern="\d{1,2}/\d{1,2}/\d{4}" class="datepicker" name="date" value="" />
我使用这个website,这个模式也做闰年验证。
<input type="text" pattern="(?:19|20)[0-9]{2}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-9])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:30))|(?:(?:0[13578]|1[02])-31))" required />
图案= “[0-9] {1,2} / [0-9] {1,2} / [0-9] {4}”
这是在HTML5中输入文本框日期的模式。 第一个[0-9] {1,2}只取十进制数最小值1和最大值2。 和其他类似的。
尝试使用:
pattern="(0?[1-9]|[12][0-9]|3[01])/(0?[1-9]|1[012])/\d{4}"
下面的模式完美适用于闰年和正常日期。日期格式为:YYYY-MM-DD
<input type="text" placeholder="YYYY-MM-DD" pattern="(?:19|20)(?:(?:[13579][26]|[02468][048])-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-9])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:30))|(?:(?:0[13578]|1[02])-31))|(?:[0-9]{2}-(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:29|30))|(?:(?:0[13578]|1[02])-31)))" class="form-control " name="eventDate" id="" required autofocus autocomplete="nope">
我从http://html5pattern.com/Dates得到了这个解决方案。希望它可以帮助某人。