PayPal样式日期输入

时间:2015-07-19 07:48:10

标签: jquery html5 validation input

我正在设计一个注册表单。我对PayPal的注册表格非常着迷,我们只能在日期输入数字,并使用" /"自动分隔它们。我们无法添加更多数字。这是链接https://www.paypal.com/signup/create?country.x=AU

我想知道这是怎么做到的。 这是我在观察时发现的。

<input type="text" id="dob" maxlength="10" value="" pattern="(0[1-9]|[12][0-9]|3[01])/(([0][1-9])|([1][0-2]))/((1|2)[0-9]{3})" name="dob" required="required" class="hasHelp validate userText" autocomplete="off" autocorrect="off" autocapitalize="off" aria-required="true" data-placeholder-text="DD/MM/YYYY" data-label="Date of birth" data-format="ddmmyyyy" data-today="19/07/2015" data-separator="/" aria-invalid="false">

2 个答案:

答案 0 :(得分:0)

你可以使用jQuery的一个输入掩码插件 例如:http://robinherbots.github.io/jquery.inputmask/

那里有一个演示,你可以download it from here

答案 1 :(得分:0)

HTML 5具有输入元素的模式属性,Paypal实现:

pattern="(0[1-9]|[12][0-9]|3[01])/(([0][1-9])|([1][0-2]))/((1|2)[0-9]{3})"

您可以在网上找到有关该信息的更多信息,例如Mozilla Developer Network上的此规范。