Ztree 模糊搜索

本文主要是介绍Ztree 模糊搜索，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

在做Ztree搜索时，发现有点问题，当搜索框的值为空时，不能显示全部的Ztree,有些人选择重新加载Ztree,感觉对服务器是一种压力，我的观点是客服端做的不让服务器去做，另外有一个观点把隐藏的点遍历出来，当为空时，加载数组，这种没有弄出来，现在有一种简单的方法去实现，CSDN中有一个下载资源要13积分，简直丧心病狂了，很气愤，就写下来了，引用了别人的一些代码!

关键代码如下：

 if ($("#treeSearch").length) {

        $('#treeSearch').on('keyup', function (e) {
          
            search_keyword("tree", $(this).val());
        });

}

function search_keyword(treeId,keyword) {
    if (keyword === "") {
        //显示上次搜索后背隐藏的结点
        var nodes = $.fn.zTree.getZTreeObj(treeId).getNodesByParam("isHidden", true);

        $.fn.zTree.getZTreeObj(treeId).showNodes(nodes);
        return;
    }

    var zTree = $.fn.zTree.getZTreeObj(treeId);
    var allNodes = zTree.transformToArray(zTree.getNodes());
    zTree.hideNodes(allNodes);    //当开始搜索时，先将所有节点隐藏

    var nodeList = zTree.getNodesByParamFuzzy('name', keyword, 0);    //通过关键字模糊搜索
    var arr = new Array();
    for (var i = 0; i < nodeList.length; i++) {
        arr = $.merge(arr, nodeList[i].getPath());    //找出所有符合要求的叶子节点的路径
    }
    zTree.showNodes($.unique(arr));    //显示所有要求的节点及其路径节点
    zTree.expandAll(true);    //展开路径
}

以上代码应该可以解决大部分问题了!

这篇关于Ztree 模糊搜索的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---