jquery-ui-multiselect-widget 加载数据时闪烁？

Question

jQuery MultiSelect UI 小部件 1.14pre

这对我来说是一个长列表的问题。加载和加载后效果请参见下图(点击链接)。

我刚刚在 mozilla 机器上测试了包含 1600 个项目的列表，浏览器锁定了大约 5 分钟。

https://camo.githubusercontent.com/3dc1a939065e6364e699eef8f08b9cd653741cf0/68747470733a2f2f662e636c6f75642e6769746875622e636f6d2f6173736574732f333439313130312f3335313235362f61636133333962652d613034322d313165322d393462382d3239396561333065663532632e706e67

示例:假设我需要在我使用 multiselect.js 的网页上的下拉列表中显示 1000 个名称。当此网页加载时，所有名称都会出现 <select><option</option></select>标签。完成加载后，这将变成多选下拉菜单。

$(function(){
    $("#"+ prefix + "schedule_id").multiselect({
      header: 'Travels',
      noneSelectedText: 'Travels',
      selectedText: 'Travels',
      prefix: prefix + 'travels',
    }).select2;
});

** 在下拉列表中加载数据时，它会闪烁。正如我在图片中所示1) 加载页面/数据时。2)加载页面/数据后。

有什么建议可以解决这个问题吗？

Answer 1

我猜想这与您的 AJAX 数据加载方式有关 - 可能会导致连续的重新初始化。在初始化/重置下拉列表之前，尝试将完整数据完全加载到值元素中。

或者，您可以考虑将下拉选项的数据集存储为文本文件，并将该文本文件加载为选项内容，而不是实时 AJAX。如果选项内容变化不太快，这会很有效。 (您可以在需要时运行单独的周期来定期更新选项文本文件)

我推荐的第三个选项是使用谷歌类型过滤选择器。这样就可以在整个 1000 个选项列表中搜索匹配项，而不是尝试呈现整个可滚动列表。