通过textfield的jQuery搜索数组

我正在努力找出如何使这项工作的大学项目，一些帮助将是惊人的

我有一个mysql数据库，它存储了很多项目。（我能做这一点没问题）

---

我有一个搜索框，需要在你键入时搜索项目数据库。（我相信你知道我的意思吗？有点像谷歌即时搜索）

单击建议项目下拉列表中的可能项目时。 它通过jquery附加一个无序列表，将项目添加到其中

但是我不知道该怎么做

我对我的意思进行了jquery处理，而不是在这里粘贴代码

希望你能帮忙

谢谢

---

Owen

您查看了jQueryUI自动完成和那里的示例了吗

---

这将帮助您完成“键入时搜索”部分。

您可能需要这样的内容：

$("#text").keyup(function() {
    var input = $("#text").val();
    $.post("someurl/myService.cgi", {
        searchTerm: input
    },
    function(data) {
        $.each(data, function(index, value) {
            $("#list").append("<li>" + value + "</li>");
        });
    },
    'json'
});

$（“#text”）.keyup（函数（）{
var输入=$（“#文本”）.val（）；
$.post（“someurl/myService.cgi”{
搜索词：输入
},
功能（数据）{
$.each（数据、函数（索引、值）{
$（“#列表”）。追加（“
”+value+“
”）；
});
},
“json”
});

但是，在将数据发布到服务器之前，您应该对输入进行一些验证。也可以使用$.data（）缓存一些搜索结果，除非它堆积太多，以避免服务器点击太多。您可以使用

$（“#list”）.empty（）来

在两次搜索之间从建议列表中删除所有项目。

尝试查看

该页面上有一个示例，根据您键入的内容从db中获取结果。我假设您可以从那里获取结果（获取单击的项目并将其添加到页面/块）。 我希望我正确理解了你的问题

$(function() {
    $('#list').hide();
    $("#find").click(function(){
        $('#list').toggle();
    });
    $('#find').bind('keyup', function(){
        $('ul#list li').css({display : 'none'});
        $('#list li').each(function(){
            var e = $(this).text().toLowerCase();
            if (e.indexOf($('#find').val().toLowerCase()) != -1){
                $(this).css({display : 'block'});
            }
        });
    });
});

---

用这个替换你的js。它将在你键入时填充ul。注意：要想看到它工作，请确保一直到第2项，因为它匹配字符，你将看到所有3个结果，直到你有一个字符不匹配为止。

对于懒惰的学生。（啊，好时光^^）

“有点像谷歌即时搜索”。它被称为自动完成。大约有二十多万个jquery插件专门用于增强我们的用户惰性。但thanx for fiddle:）您是否必须在用户键入时提取数据，或者是否可以将您认为需要的所有数据发送到页面，并将其存储在javascript对象中，并在需要时从对象中提取数据？通过缓存策略，一切都是可能的。我通常会在每次按键时提取数据，主要是因为我的用户喜欢在输入“hell”之前找到“hell”和“hello”，然后再输入“aaa其他地狱般的东西”。（数据越大，经常查询数据库就越好）。如果要查询数据库一次，最好的方法是在自动完成之前进行查询。将结果放入数组或对象中，并将其设置为自动完成的源。插件将过滤输入的文本。是的，roselan，我本来打算用json或数组填充选项，但我确实在文章标题中包含了它，但显然这并不明显！谢谢，但我需要使用.html（），因为出于设计原因，那里总是有9个li。我只是想给你指出正确的方向，并认为你会从那里开始。不管怎么说，查看发布的其他一些解决方案可能更容易。