How can I validate a field client-side using HTML5 that is read only?

Question

I have an input field that launches a datepicker. To make this work on a mobile device, I've made the field read only. This means that I can launch a date picker on click (or tap) using jQuery, and the tap doesn't open the keyboard on a mobile device.

However - a readonly attribute bypasses the HTML5 validation mechanisms. Can I add something that then either mimics the HTML5 validation look and feel, to keep consistency, or that forces HTML5 validation despite the field being readonly?

Edit: I'm looking for validating that the field is filled in (required) and preferably that it fits a certain date format.

Answer 1

readonly fields cannot have the required attribute, generally they will already contain some value.

Look at the HTML5 Standard Drafts

Answer 2

尝试查看'pattern'属性。

对于日期，这种模式可能派上用场：

^\d{4}\-\d{1,2}\-\d{1,2}$|^\d{1,2}\/\d{1,2}\/\d{4}$