HTML and CSS Reference
In-Depth Information
Ta k i n g t h e e x a m p l e of f a t i m e c of n t r of l , y of u c a n a l s of u s e step=any .
This allows any time in the day to be selected, with any accu-
racy (for example, thousandth-of-a-second accuracy or more);
normally, time controls are limited to an accuracy of one minute.
<input name=favtime type=time step=any>
Putting all this together
It's pretty confusing to work out which attributes go with which
input types when you're meeting them all at once as we are
here. But it's actually quite straightforward when you start using
them. For example, you can't use min and max on a <textarea> ,
because that wouldn't make sense, but you can use required .
A blog comments form
Let's look at a classic form example that most of us will already
be familiar with. Nearly all blogs have a comment section, with
fi e fi d s fi o r c o m m e n t e r ' s n a m e ( r e q u fi r e d ) , h e r e m a fi fi a d d r e s s
(required), URL (optional), and the comment (required). That
would need a fair bit of JavaScript if we were to do our form
validation by hand.
In HTML5, however, it requires only some new form types, each
with a name attribute that the spec requires in order to participate
in automatic validation. We also add a submit button—currently
Opera only validates fields when a form is actually submitted,
although the :invalid pseudo-class is applied as the user types.
<form>
<label for=form-name>Name</label>
<input name=form-name id=form-name type=text required>
<label for=form-email>Email</label>
<input name=form-email id=form-email type=email required>
<label for=form-url>URL</label>
<input name=form-url id=form-url type=url>
<label for=form-comment>Comment</label>
<textarea name=form-comment id=form-comment required>
</textarea>
<input type=submit>
</form>
Presto! No JavaScript is needed at all!
 
 
Search WWH ::




Custom Search