ztree搜索節點並展開

web

<div class="zTreeC">
            <div class="searchL" lay-filter="searchL" style="background:none;">
               <form class="layui-form clearF">
                    <div class="input-group input-group-sm float-left" style="margin-left:5px;">
                        <div class="layui-input-inline">
                            <input id="keyword" name="" tag="" class="layui-input"
                                type="text" placeholder="請輸入名稱搜索" autocomplete="off" />
                        </div>
                    </div>
                    <div class="float-right minor-btns">
                        <button type="button" id="search" class="btn btn-pr btn-sm publicButton">搜索</button>
                    </div>

                </form> 


            </div>
            <div id="treeNode" class="ztree "></div>
        </div>

js   第一種  點擊查詢按鈕執行

//條件搜索    節點選中並顯示信息
$("#search").click(searchNodes);
function searchNodes(){
      var treeObj = $.fn.zTree.getZTreeObj("treeNode");
      var keyword=$("#keyword").val();
      var nodes = treeObj.getNodesByParamFuzzy("name", keyword, null);  //根據節點數據的屬性搜索，獲取條件模糊匹配的節點數據 JSON 對象集合,(keywords)模糊匹配只能針對 String 類型的數據
      for(var i = nodes.length-1; i >= 0; i--) {
              treeObj.selectNode(nodes[i]); //會讓節點自動滾到到可視區域內
      }
      //顯示第一個選中的節點信息
      dataItemId = nodes[0].id;
      fun.search();//查詢節點信息的方法
}

第二種  去掉查詢按鈕, input框變化就執行

document.getElementById("keyword").addEventListener("input", test, false);
function searchNodes(){
　　var treeObj = $.fn.zTree.getZTreeObj("treeNode");
　　var keywords=$("#keyword").val();
　　var nodes = treeObj.getNodesByParamFuzzy("name", keywords, null);
　　for(var i = nodes.length-1; i >= 0; i--) { treeObj.selectNode(nodes[i]); //會讓節點自動滾到到可視區域內  }

 　//顯示第一個選中的節點信息 dataItemId = nodes[0].id; fun.search();//查詢節點信息的方法

} 

searchNodes方法與其餘ztree的方法是平級的