Problem
I’m new to HTML5 as begun to work with HTML5’s new form input fields. When I’m working with form input fields, especially and IMO there wasn’t any difference in all major browser including Safari, Chrome, Firefox and Opera. And the search field also behaves like a regular text field.
So, what’s the difference between an HTML5 input type=”text” and an HTML5 input type=”search”?
What does input type=”search” /> really mean?
Asked by Vijin Paulraj
Solution #1
There isn’t a big thing between them right now, and there may never be. However, the purpose is to let browser developers to build something unique with it if they so desire.
Consider how type=”number” brings up number pads on telephones, or how type=”email” brings up a customized version of the keyboard with @ and.com and the rest.
If they chose, they could use search on their phone to bring up an internal search applet.
On the other hand, it aids current CSS developers.
input[type=search]:after { content : url("magnifying-glass.gif"); }
Answered by Norguard
Solution #2
Also,
<input type=search results=5 name=s>
Reference
Above all, it provides a semantic meaning to the input type.
Update:
The results attribute has been deprecated in Chrome 51.
Answered by Jashwant
Solution #3
If the input type is’search,’ there are two visual/functional differences:-
Answered by Harsh Raj
Solution #4
It also supports the “results” and “autosave” properties on some browsers, allowing for automated “recent searches” functionality with the magnifier symbol.
More info
Answered by Scott Wilson
Solution #5
Actually, don’t make the mistake of presuming it accomplishes nothing. When you use the type search to style inputs, there are some attributes that you can’t edit. If you try to modify the border on one, you’ll discover that it’s nearly impossible. There are a few more CSS characteristics that aren’t allowed; see this page for more information.
There’s also the result attribute, which Jashwant suggested, however it doesn’t work very well unless you also include the autosave attribute. However, most browsers will not work with the drop down, so use at your own risk.
Answered by sage88
Post is based on https://stackoverflow.com/questions/11589770/input-type-text-vs-input-type-search-in-html5