Javascript 如何创建此搜索操作

我有一个包含以下格式的多种形式的页面：

<form id="new_celebration100001237275604" accept-charset="UTF-8" action="/celebrations" method="post">
    <input id="friend" type="hidden" name="celebrant_details" value="%7B%22name%22%3A%22Venessa%20Stackpole%22%2C%22provider_user_id%22%3A%22100001237275604%22%2C%22birthday%22%3A%2212/10%22%2C%22provider_name%22%3A%22Facebook%22%7D">
    <input id="manager" type="hidden" name="manager_details" value="%7B%22name%22%3A%22Mitchell%20Gould%22%2C%22provider_user_id%22%3A%22751640040%22%2C%22birthday%22%3A%2210/07/1967%22%2C%22email%22%3A%22mitchellgould7@gmail.com%22%2C%22provider_name%22%3A%22Facebook%22%7D">
    <li>Venessa Stackpole</li>
    <li>12/10</li>
    <li>
    <img src="http://graph.facebook.com/100001237244444/picture">
    </li>
    <input class="button-mini-subtle submit" type="submit" alt="select" value="select">
    </form>

维尼萨斯塔克波尔酒店
12/10

由于该页面可能包含数百个这些，我想给用户一个搜索框。 当他们开始在框中输入时，我想为与这些字母不匹配的用户隐藏表单和数据，以便他们更容易找到朋友

我是一个笨蛋，如果能在这件事上给我指出正确的方向，我会非常感激。 每个表单都有一个唯一的ID，如图所示。但是，我不知道如何根据

用户名的值来选择表单

如果可能的话，我希望能够用jquery来完成这项工作。
通常我会给你的
li
上课，例如：

<li class="username">User Name</li>

用户名

然后使用“$”（“li.username”）查找所有

li

s并进行筛选。对于过滤器，您需要根据用户输入创建一个新的

RegEx

对象，并与

li

中的文本进行匹配。然后在过滤的

li

上执行

parentUntil（“表单”）

以查找表单

---

我很久没有接触jQuery了，可能在语法上有一些错误。但是这种方法应该是正确的，因为我在多个实例中使用它。

这里是一个例子。你可以看到它在工作

HTML#添加了搜索框

Javascript

var $forms = $('form');
$(function() {
    $('#searchBox').keyup(function() {
        var $form, needle = $(this).val().toLowerCase(), haystack;
        $forms.each(function() {
            $form = $(this);
            haystack = $form.find('li:first').text().toLowerCase();
            $form.toggle(haystack.indexOf(needle) > -1);
        });
    });
});

---

嗨，埃姆雷·尔坎，我会试试的。看起来很棒。我会回来报告的，非常感谢。我喜欢大海捞针的想法：）嘿，我尝试过它和$forms。每个（函数（）{…似乎都不会像没有循环一样启动。我尝试过做一个测试警报（$forms），它会生成object对象。作为NOOB，我不知道如何查看object对象的内容：(