CHAPTER 9
A Form of Madness
Diving In Everybody knows about web forms, right? Make a <form>, add a few <input type="text"> elements and maybe an <input type="password">, finish it off with an <input type="submit"> button, and you’re done. You don’t know the half of it. HTML5 defines over a dozen new input types that you can use in your forms. And when I say “use,” I mean you can use them right now— without any shims, hacks, or workarounds. Now don’t get too excited; I don’t mean to say that all of these exciting new features are actually supported in every browser. Oh goodness no, I don’t mean that at all. In modern browsers, yes, your forms will kick all kinds of ass. In legacy browsers, your forms will still work, but with less ass kicking. Which is to say, all of these features degrade gracefully in every browser. Even IE 6.
Placeholder Text The first improvement HTML5 brings to web forms is the ability to set placeholder text in an input field. Placeholder text is displayed inside the input field as long as the field is empty and not focused. As soon as you click on (or tab to) the input field, the placeholder text disappears. You’ve probably seen placeholder text before. For example, Mozilla Firefox 3.5 now includes placeholder text in the location bar that reads “Search Bookmarks and History”, as shown in Figure 9-1.
Figure 9-1. Placeholder text in Firefox’s search box
147
Download from Library of Wow! eBook <www.wowebook.com>