HTML 数据列表显示由水平线分隔的额外选项

Question

我将 10 个选项传递给 datalist，这些选项在下拉列表中显示得很好。但有时我会在选项列表底部看到更多由水平线分隔的选项（Chrome 可能正在缓存或重复显示某些选项）。我不明白为什么 chrome 会显示这些由水平线分隔的额外选项

Answer 1

我浏览了互联网上与 datalist 相关的不同文章，我开始知道 datalist 接受自动完成属性。它给我一个提示，我得到的额外选项（可能是 - 以前的搜索、建议）可能是由于数据列表的自动完成功能，所以我尝试将其设置为“关闭”。现在我不再在选项列表中获得那些额外的选项和水平线。例如代码片段 -

<input list="browsers" autocomplete="off">

<datalist id="browsers">
  <option value="Internet Explorer">
  <option value="Firefox">
  <option value="Chrome">
  <option value="Opera">
  <option value="Safari">
</datalist>

我还遇到了 datalist 接受的另一个属性，autocorrect="off"。但我不需要这个属性来解决上述问题。