HTML:有没有办法允许用户输入他们的输入,但也有一个下拉选择菜单？

Question

例如,我有

 <label class="form">Menu</label>
      <select id="selection" name="select" required>
           <option value="" selected>--Select an Option--</option>
           <option value="option1">Option 1</option>
           <option value="option2">Option 2</option>
           ...
      </select>

当用户用鼠标点击输入框时,这只会给出一个下拉菜单.但是我想让他们选择能够输入输入框,例如:

如果用户键入option1它会将它们指向"选项1"下拉菜单等.如果用户键入下拉列表中未包含的任何其他单词,则会显示"无效输入".

Answer 1

就在这里!带有list属性的文本输入:

<input type="text" name="city" list="cityname">
<datalist id="cityname">
  <option value="Boston">
  <option value="Cambridge">
</datalist>

编辑:对于自动完成,请尝试Bootstrap Typeahead