多重选择与数据列表(multiple selections with datalist)

我使用的标签创建为我的搜索框建议列表，但我不能选择从数据列表多个值。目前，我的HTML是：

<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>

它将提供建议，为一个项目，但之后该建议不会建议我的第二个选择自动完成。我认为，“多”的标签是所有我需要的（并且是在网上提出什么），但它似乎并没有收到预期的效果。

有什么建议？

Answer 1:

多目前仅与输入型=“电子邮件”，只有在Chrome和Opera工作

看看这个简约的例子：

<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/ ）

首先输入将工作，第二个非门。 您只需按下逗号，列表将显示为点击进入输入相同。

Answer 2:

定制的DataList接受多个值：

https://jsfiddle.net/bhbwg0rg/1/

每个条目按，（逗号），然后空格键后

<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>