HTML 5 Search Input Text Field

Posted in Featured Tutorials

New to HTML 5, is the search input field. We of course have the input field long ago. But HTML5 added add the new type attribute type=”search” which you can use as follow…

See live code here.

Note that HTML5 also supports the placeholder attribute.

And we see how this works in Chrome 8 …

See the placeholder text is shown in a lighter color. And when we start typing, the placeholder text disappears and an cancel “X” icon appears.

Traditionally, this kind of functionality is done via Javascript or JQuery. And you can still use that for browsers that do not support HTML5.

But for browser that support HTML5, you get all that built in for you by the browser.

Reference to HTML 5 Search Input Field

W3C working draft document of HTML 5 Search input field

---