Javascript Jquery脚本冻结浏览器但仍在工作

我正在尝试对我的移动网站进行实时搜索，我不想每次用户键入一封信时都查询数据库，所以我创建了一个包含所有可搜索名称的有序列表，我使用jquery循环搜索，问题是我有3300个名称，当它搜索这些名称时会冻结浏览器，有人能给我一个更好的方法吗？这是我的密码：

$(document).ready(function(){
    $("input#search").keyup(function(){
        var filter = $(this).val(), count = 0;
            var html = "";
        $("ol.pacientes li").each(function(){
                    var nome_paciente = $(this).text();
                    if(nome_paciente.indexOf(filter.toUpperCase()) != -1){
                        html = html + " " + nome_paciente;
                    }

                    $('#pacientes_hint').html(html);
        });

---

使用jQuery自动完成版本。您可以加载一个包含所有姓名的数组，并将其传递给autocomplete，这将动态工作

---

您可以将每个选项更改为：

var text = $("ol.pacientes li:contains(\""+filter.toUpperCase()+"\")").map(function() {
    return $(this).text();
}).join(' ');
$('#pacientes_hint').text(text);

除了更短之外，唯一的改进是只在末尾设置

$（“#pacientes_hint”）

的内容，这可能会有所帮助

---

如果您需要更具创造性的解决方案，请告诉我。

首先，您可以将#pacientes_提示移到每个功能之外

$(document).ready(function(){
$("input#search").keyup(function(){
    var filter = $(this).val(), count = 0;
        var html = "";
    $("ol.pacientes li").each(function(){
                var nome_paciente = $(this).text();
                if(nome_paciente.indexOf(filter.toUpperCase()) != -1){
                    html = html + " " + nome_paciente;
                } // end if


    }); // end each
     $('#pacientes_hint').html(html);

然后，您可以在keyup处理程序之前将ol.pacientes定义为一个变量，这样它就不会每次都查找它，而在each函数中，在变量内搜索：

$(document).ready(function(){
var pacientes_list = $("ol.pacientes");
var pacientes_hint = $("#pacientes_hint");
$("input#search").keyup(function(){
    ...
    $("li", $(pacientes_list)).each(function(){ // search in the container
       ...     
    }); // end each
     $(pacientes_hint).html(html);

---

您应该转义输入文本：

filter.toUpperCase（）.replace（“”，“\\”）

我尝试了这个，搜索速度非常快，但对于iphone浏览器来说还不够快，不过谢谢Hanks，刚刚尝试了这个，速度足够快，现在在自定义输出方面遇到了问题，谢谢