1

我正在通过 jQuery 创建一个页面搜索功能。搜索功能应该从输入字段中搜索字符串。如果没有任何匹配项，则应隐藏所有内容，如果找到某些内容，则应显示li上面所有父项的元素。

直播中是这样的

这是我的代码：

$("#filter").keyup(function(){
    var filter = $(this).val(), count = 0;
    if(filter == '') {
        $("div#jQ-menus ul").not(".is-open, .main").fadeOut();
    } else {
        $("div#jQ-menus ul li").each(function(){
            if ($(this).text().search(new RegExp(filter, "i")) < 0) {
                // if not relevant
                $(this).fadeOut();
            } else {
                // if relevant
                $(this).fadeIn();
                $(this).parents("ul").fadeIn();
                count++;
            }
        });
        var numberItems = count;
    }
});

所以有一个像这样的html输出：

<ul class="main">
    <li class="main">
    <span class="toggle" style="cursor: pointer;">+ FBB Werk Hinwil 2012</span>
    <ul style="display: none;">
        <li>
            <span class="toggle" style="cursor: pointer;">+ Fundationsschicht</span>
            <ul style="display: none;">
                <li>
            </ul>
        </li>
        <li>
            <span class="toggle" style="cursor: pointer;">+ Deckschicht</span>
            <ul style="display: none;">
        </li>
    </ul>
</ul>

一切都很好。但是现在如果我打开一棵树然后我要搜索一些东西，它就可以了。然后，如果我删除搜索字符串，它应该像使用搜索功能之前一样显示相同的树。问题来了。所有的li都不能再点击了。也许我只是设置了一些错误的类，或者我这个搜索功能背后的逻辑不可靠。

我使用目录树来创建树。

有人可以在这里帮忙吗？

4

0 回答 0