有效地将24k个条目加载到选择列表中

Loading 24k entries into a select list efficiently

本文关键字：选择 列表 加载 24k 有效地      更新时间：2023-09-26

我有一个经典的ASP页面，当加载做一个JavaScript调用另一个ASP页面检索XML加载到我的<select>框。它必须加载大约24k个选项;不用说，这是相当麻烦的。

它们并不都需要立即加载，只要页面不挂起，如果加载需要一段时间也没关系。该页面需要在IE6+中工作。

我考虑过，当用户滚动过去一个给定的部分，它将加载在100多个，然而，找不到一个合适的属性，将在IE6滚动条的位置工作。我考虑使用特定选项的onmouseover(即"Hover for more results…")，但事件没有触发。

如果有人能给我指出正确的方向，我将非常感激。:在

您应该设置一个服务，使用类似于服务器端后台存储的东西将您的项目延迟加载到Select List中。

如果我要尝试解决这个问题，我会沿着JsonRestStore路线并使用Dojo Toolkit，在需要时请求项目，然后将它们填充到ComboBox/FilteringSelect中。

这里有一些资源给你。

http://livedocs.dojotoolkit.org/dojox/data/JsonRestStore

下面是一个filter Select功能的演示。

最后我要补充一点，将所有这些加载到DOM中总是一个坏主意。你应该使用网格或其他东西，或者在他们输入时使用预测器来缩小范围。

我使用一个JsonRestStore，它为一个包含大约500万个项目的网格提供动力。我所做的就是在用户向下滚动页面时加载新项目。当它们滚动时，它检测到我需要从服务器中取出另外25个项目，这将启动一个新的查询，然后将其加载到网格中。

我想你说的"select list"是指HTML元素

<select>
  <option>option 1</option>
  ...
  <option>option 24000</option>
</select>

简而言之，选择列表中超过10-15个选项是非常糟糕的可用性。因此，如果这是您的情况，您可能需要重新考虑交互，因为即使是火箭科学家也很难在24,000个选项中找到并选择正确的选项。

对于那些绝对坚持使用下拉框的人，我可以让它不锁定浏览器的唯一方法是使用settimeout。在chrome中，这运行得很好，但IE可以接受的最低超时是13MS，这确实阻碍了加载时间。最重要的是，我(个人)认为这是一个非常丑陋的解决方案……但我想这比锁定表单要好。

var i = 0;
function doStuff()
{
// code to execute, ie, add items
i++;
if (i != end of loop)
{
setTimeout(doStuff, 1);
}
setTimeout(doStuff, 1);
我发现的另一条建议是通过使用代码片段或隐藏下拉框(简单地设置样式)来避免回流。显示为"none")，直到添加完所有项。
相关文章：