I'm using the tag to create a list of suggestions for my search box, but I cannot select multiple values from the datalist. Currently, my HTML is:
<html>
<form action="search_tags.php" method="GET"/>
Search: <input type="text" multiple="multiple" name="search" list="tags" autocomplete="off" />
<datalist id="tags">
<option value="black">
<option value="gold">
<option value="grey">
<option value="pink">
<option value="turquoise">
<option value="red">
<option value="white">
</datalist>
</html>
It will offer suggestions for one item, but after that the suggestions won't suggest an autocomplete for my second option. I thought that the 'multiple' tag was all I needed (and what is suggested online) but it doesn't seem to have the desired effect.
Any suggestions?
Multiple currently working only with input type="email" and only in Chrome and Opera
look at this minimalist example:
<input type="email" list="emails" multiple>
<datalist id="emails">
<option value="first@example.com">
<option value="second@example.com">
<option value="third@example.com">
<option value="last@example.com">
</datalist>
<input type="text" list="texts" multiple>
<datalist id="texts">
<option value="black">
<option value="gold">
<option value="grey">
<option value="pink">
<option value="turquoise">
<option value="red">
<option value="white">
</datalist>
( http://jsfiddle.net/iiic/t66boyea/1/ )
First input will be working, second NOT. You only press comma, and list will appear as same as on click into input.
Customized datalist to accept multiple values:
https://jsfiddle.net/bhbwg0rg/1/
After each entry press ,(Comma) and then Spacebar
<label for="authors">Type authors from favorite to least favorite</label>
<input type="text" list="names-list" id="authors" value="" size="50" name="authors" placeholder="Type author names">
<small>You can type how many you want.</small>
<datalist id="names-list">
<option value="Albert Camus">
<option value="Alexandre Dumas">
<option value="C. S. Lewis">
<option value="Charles Dickens">
<option value="Dante Alighieri">
</datalist>
According to this 'multiple' attribute is only valid with email and file input types.
来源：https://stackoverflow.com/questions/14148538/multiple-selections-with-datalist