利用ztree实现树搜索

本文介绍了如何使用zTree实现树搜索功能,包括延迟搜索和模糊搜索,适用于单选场景。针对46000个测试数据,搜索耗时在1s到1.5s之间。同时,文章指出了这种搜索方式的两个缺点:1) 用户输入过程中可能造成连续搜索导致的卡顿;2) 不适用于需要排除某些节点的多选场景。
摘要由CSDN通过智能技术生成
最近工作中需要利用ztree实现树搜索功能,在网上看了一下别人的轮子觉得都有点不适合需求,所以根据自己的实际情况进行了改进,经过几次优化,觉得效果还能用:  
/**
* 搜索功能3.0
* @type {Element}
*/
var node = document.querySelector('#client_name');
var cpLock = false;
var bower = myBrowser()  //判断浏览器类型,在此省略

//实现延迟搜索,如果上次的输入还没有被执行,那么就取消上一次的执行
var timeoutId = null;
function searchNodeLazy(keyword) {
    if (timeoutId) {
        clearTimeout(timeoutId);
    }
    timeoutId = setTimeout(function(){
        search_keyword(keyword);
    }, 500);
}

//实现模糊搜索
function search_keyword(keyword) {
    if(keyword === ""){
        return;
    }

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

    var nodeList = zTree.getNodesByParamFuzzy('r
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值