如何关闭输入下拉选项的过滤

Question

使用 select 元素，当用户从可用选项中进行选择时，他们可以再次单击，所有选项仍然可用。 但是，用户不能在同一个框中键入以添加任何新选项。

使用带有 datalist 的输入文本类型元素，当用户进行选择时，该字段中的文本将成为过滤器，以便在下次单击时，下拉选项已被相应过滤，用户必须采取额外的删除步骤文本以查看完整列表。

有什么方法可以禁用该过滤，这样我就可以两全其美了……还是我要求太多了？ 我希望找到一个解决方案，它只是普通的 HTML（可能是 JS 或 CSS），最好没有特殊的库或框架（可能是一些简单的单行代码）。

https://jsfiddle.net/MarkSeagoe/he15vfy8/5/

“到 jsfiddle.net 的链接必须附有代码。” - 好的在这里：

<div style="display: block; margin: 0 auto; width: 300px;">
  <div class="ui input">
    <select type="text" id='f1_state1' name="state" placeholder="Address" style="width:180px" required>
      <option>Washington</option>
      <option>Oregon</option>
      <option>California</option>
    </select>
  </div>
  <div class="ui input">
    <input type="text" id='f1_state2' name="state" placeholder="State" style="width:180px" required list="stateList">
    <datalist id="stateList">
      <option for="f1_state">Washington</option>
      <option for="f1_state">Oregon</option>
      <option for="f1_state">California</option>
    </datalist>
  </div>
</div>

谢谢！