The community is working on translating this tutorial into Chinese, but it seems that no one has started the translation process for this article yet. If you can help us, then please click "More info".
If you are fluent in Chinese, then please help us - just point to any untranslated element (highlighted with a yellow left border - remember that images should have their titles translated as well!) inside the article and click the translation button to get started. Or have a look at the current translation status for the Chinese language.
If you see a translation that you think looks wrong, then please consult the original article to make sure and then use the vote button to let us know about it.
Please help us by translating the following metadata for the article/chapter, if they are not already translated.
If you are not satisfied with the translation of a specific metadata item, you may vote it down - when it reaches a certain negative threshold, it will be removed. Please only submit an altered translation of a metadata item if you have good reasons to do so!
HTML5 gives you different opportunities to validate dates. The browsers that understand the date element provide your users with handy drop down calendars to pick the dates from. This prevents your users from misunderstanding the date format or deliberately to pick incorrect or non-existing dates.
The date element provides you with six different ways f defining dates: date, month, week, time, date + time, and date + time – time zone. As of right now, the support is at best sparse as Opera is the only browser that provides these drop down calendars and Chrome provides the bare minimum – spinboxes in which the user cannot choose an invalid number. Therefore, if you want to implement the date element you would also have to use a polyfill to support it properly.
If you use the “Try this example" feature then please note that I have not implemented any polyfill to support the date element and therefore the example will reflect how your current browser actually renders the element.
The format for the date type is YYYY-MM-DD, which means that May 14th 2012 would be rendered 2012-05-12. This is a classic choice for anything from vacation dates to delivery dates.
<form> <input type="date"> <input type="submit" value="Submit Now!"> </form>
The format for the month type is YYYY-MM, which means that May 2012 would be rendered 2012-05.
<form> <input type="month"> <input type="submit" value="Submit Now!"> </form>
Sometimes all you need is a week, and the format for the week type is YYYY-Www, which means that week 12 in 2012 would be rendered 2012-W12.
<form> <input type="week"> <input type="submit" value="Submit Now!"> </form>
Sometimes you need a specific time and the time type is renderes HH:mm:ss.ss but the seconds are optional. This means that 4.30 p.m. would be rendered 16:30 or if you choose to include seconds, 16:30:23.4
<form> <input type="time"> <input type="submit" value="Submit Now!"> </form>
Date & Time
The datetime type has a long format: YYYY-MM-DD THH:mm:ss.s and May 14th 2012 would be rendered 2012-05-12 T16:30:23.4
<form> <input type="datetime"> <input type="submit" value="Submit Now!"> </form>
What you have learned
- There is several different ways of validating dates
- The date attribute support is of right now very sparse and therefore you should consider using a polyfill to support it