jQuery自动完成大阵列（9500）性能

我正在将JSON文件加载到数组中，然后将该数组传递给jQuery自动完成以用作其数据源。jQuery自动完成大阵列（9500）性能

我想要实现的是当自动完成文本框有焦点显示所有可用的选项，我已经设法得到这与下面的代码工作。我遇到的问题是该阵列有大约9,500个条目，加载速度非常慢，是否有提高性能？或者对于大数组是9,500？

加载JSON文件

 $.getJSON("./json/airportdata.json", function(data){ 
      for (var i = 0, len = data.length; i < len; i++) { 
       arrival_airports.push(data[i]); 
       //console.log(data[i]); 
      } 
     });

自动填充代码

 $("#ajax").autocomplete({ 
      source: departure_airports, 
      minLength: 3, 
      select: function(event, ui) { 
       $("#ajax").val(ui.item.value); 
      } 
     });

上聚焦触发自动填充

 $("#ajax").focus(function() { 
      $(this).autocomplete("search", ""); 
     });

来源

2017-02-08 Neil Nand

你是不是显示你如何加载数据，或者将它传递给插件 – charlietfl

@charlietfl遗憾，将在现在添加这些代码片断。 –

是的，9k单元阵列可能意味着麻烦。您是否有特定的理由提前加载所有可能的结果？您可能应该考虑在搜索时加载特定的记录集。所以当用户输入搜索短语时，只有这样你才能提取相关结果。即：

$('#search').autocomplete({ 
    source: 'serverSideToAcceptTheSearchPhrase.php', //you should expect the variable "term" to be sent via GET to this page on execution 
    minLength: 2, //optional > this will allow a trigger of the search only when 2 or more characters inserted 
    delay: 1000, // optional > this will allow a wait time of 1 sec between each keys before executing 
    select: function(event, ui) { 
     // function to trigger on "select" 
    }, 
});

来源

2017-02-08 15:24:10

提前加载它们的原因是设计/要求显示完整列表。当时没有意识到会有9,500个。从我可以告诉我的情况来看，不会在性能问题上出现问题，但我并不是那么了解该领域的所有人，所以希望有一些我不知道的东西。 –

jQuery自动完成大阵列（9500）性能

回答

相关问题