The new datalist automatic drop-down prompt text box in html5

In daily page creation, to facilitate user input, you can often enter
When the content is displayed, the autocomplete or autosuggestion function is automatically displayed,
In this way, user input can be accelerated. The current approach is to use ajax, such as DWR.
A lot of information.
In HTML5, The datalist label is added to meet the requirements
For example:

Java code
1. <input type = "text" value = "" list = "fruits"/>
2. <datalist id = "fruits">
3. <option value = "Apple"> </option>
4. <option value = "Orange"> </option>
5. <option value = "Peach"> </option>
6. </datalist>

After such code is run, when you enter the content in the text input box, three types of fruits are displayed in the drop-down list,
We recommend that you enter the following code if you are worried about browser compatibility:
Java code
1.
2. <datalist id = "fruits">
3. Pick your favorite fruit
4. <select name = "fruit_sel">
5. <option value = "Apple"> Apple </option>
6. <option value = "Orange"> Orange </option>
7. <option value = "Peach"> Peach </option>
8. </select>
9. or type one.
10. </datalist>
11. <input type = "text" name = "fruit" value = "" list = "fruits"/>

In this case, the server must capture both fruits and fruit_sel parameters.
Datalist has always been available in firefox versions. This is a compliment, whereas browsers of other versions
For compatibility, refer to this address:
Http://caniuse.com/#feat=datalist

From jackyrong