Question

我正在使用jQuery构建一个简单的搜索功能，它将根据用户输入的内容过滤项目列表。它不会做任何花哨的算法，只是一个简单的匹配。

在这里小提琴：http://jsfiddle.net/T7hF3/

如您所见，我有嵌套列表。计划是，如果任何列表项匹配，则它应显示最高父项<li>并隐藏所有其他没有匹配项的项。

如果用户没有输入任何内容，则应再次显示所有列表项！

任何人都可以帮助我指出正确的方向。我已经尝试使用jQuery的每个方法来查找包含查询的所有项目并显示它们，但它反而隐藏它们......

Answer 1

它不喜欢你使用contains()，这是元素而不是文本。我改变它使用过滤器。我还隐藏了每个元素，而不仅仅是孩子li元素，所以一切都被隐藏了。

它现在有效，但要记住它是区分大小写的......

Working jsfiddle example

$('form.groups-search').live('submit', function(e) {
    e.preventDefault();
    query = $('input#q').val();
    if (query === "") {
        $('ul.groups-tree *').show();
    } else {
        $('ul.groups-tree *').hide();
        $('ul.groups-tree li').filter(function () {
            return $(this).text().indexOf(query) != -1;
        }).show().parents().show();
    }
});?

jQuery在项目列表中搜索

1 个答案: