javascript - 缩放选择/下拉菜单的最佳实践是什么

Question

我有一个很长的值列表(长度不确定，可以继续增长)。例如:

<select>
  <option value="1">1, some test</option>
  <option value="2">2, some text</option>
  <option value="3">3, some text</option>
  <option value="4">4, some text</option>
  <option ...... add 100 more options> ..
</select> 

支持这么长的列表的最佳实践/用户友好方式是什么？我想用户可能会觉得滚动超长列表很令人沮丧。我试图通过在下拉列表顶部显示最新值来最小化用户的滚动时间，但如果她/他想转到下拉列表中的第一个元素，则需要大量滚动。

谢谢

Answer 1

而不是使用 <select> ，改成HTML5怎么样<datalist> ，就像这样:

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

顺便说一句，您可以使用 <select> 输入第一个字母，所以我的建议是根据第一个字母对数据进行排序。因为它会帮助用户直接进入子选项。