选择带有 1000 个选项的标签 - 性能下降答案

【问题标题】：Select tag with 1000 options - performance hit选择带有 1000 个选项的标签 - 性能下降
【发布时间】：2012-07-19 12:48:11
【问题描述】：

我正在使用一个名为 Chosen 的插件，它基本上将搜索添加到一个选择的 html 对象。我从 ajax 页面加载结果。但是，我在选择标签上附加了很多选项——大约一千个。也许它是选择的插件，但有 1000 个选项似乎有点滞后。

这将如何影响性能以及解决方法是什么？

【问题讨论】：

你能在 JSfiddle 上展示一个示例代码吗？
你真的有问题还是只是想知道我是否会有问题？
是的，它是滞后的。这就是问题！！！！
您是否尝试使用 select2 代替？我们在当前项目中使用它，它非常好，即使有大量数据 (ivaynberg.github.com/select2)
注意：对于 20k 个项目，我发现 select2 (3.3.2) 比选择的 (0.9.12) 慢。也就是说两者都不是很快。

标签： javascript jquery-chosen

【解决方案1】：

您可以使用<input> + <datalist> 而不是<select>，它可以很好地处理1000 多个选项。

jsfiddle

<input type="text" list="your-data-list"/>
<datalist id="your-data-list">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    ...
    <option value="9999">Option 9999</option>
</datalist>

【讨论】：

我很惊讶这比使用 SELECT 快多少。