javascript - 如何使用 TreeListFilter 列出与输入搜索文本关联的子元素？

Question

使用 http://wiki.aiwsolutions.net/2014/03/12/tree-list-filter-plugin/ 中的 TreeListFilter.js

我尝试修改代码以使匹配的输入搜索文本的子元素(ul/li)也被列出，但它不起作用。尽管如此，显示仍会停止在无序列表中的匹配级别。

非常感谢任何帮助。

Answer 1

我认为您需要进行的关键更改是首先仅搜索当前节点的直接文本，然后确保将此结果传达给子节点。

// Search own text only (not including children)
var text = liObject.clone().children().remove().end().text();

// Match or parent is visible
display = text.toLowerCase().indexOf(filterValue) >= 0 || parentDisplay;

if (liObject.children().length > 0) {
    for (var j = 0; j < liObject.children().length; j++) {
        // Ask child to search self and let them know parents display result
        var subDisplay = filterList(jQuery(liObject.children()[j]), filterValue, display);

        // If child is visible at this stage, make parent visible, if 
        // parent visible, this will already be true
        display = display || subDisplay;
    }
}       

完整示例在这里:https://jsfiddle.net/on2u2584/1/