PayPal样式日期输入

Question

我正在设计注册表单。我对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"> 

Answer 1

您可以使用jQuery的inputmask插件之一。
这里是一个例子：http://robinherbots.github.io/jquery.inputmask/

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

Answer 2

HTML 5对投入要素的模式属性，贝宝实现：

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

你可以在网上找到关于它的更多信息，例如该规范对Mozilla Developer Network。