easyui的tree之模糊查询

在不改动原有tree的前提下，添加搜索功能，增加一个input提供搜索关键字，一个div显示与tree节点相匹配的text

下面是javascript代码

        $('#tree_menu').tree({
            url: "DataList.ashx",
            prerendered: false,
            cascadeCheck: true,
            checkbox: false,
            onClick: function (node) {
                if (node.id != "" && node.id != undefined) {
                    getLivePlay(node.attributes.detlineid);
                }
            },
        });
        var treeid;
        var textid;

        //公共方法         var dojob = function () {             $("#" + textid).blur();     //失去焦点事件             var node = $("#" + treeid).tree('getChildren');    //获取Tree的所有节点             //$("#" + treeid).tree('expandAll', node.target);    //展开所有节点             var value = $(".addbg").text();        //获取文本框输入的内容

            //查找相应节点并滚动到该节点，高亮显示             for (i = 0; i < node.length; i++) {                 //var treeId = node[i].id;                 var treeName = node[i].text;                 //找到相应的设备                 if (treeName.indexOf(value) >= 0) {                     if (treeName == value) {                         //var nodes = $("#" + treeid).tree('find', treeId);   //找到当前的节点                         //$("#" + treeid).tree('scrollTo', node[i].target);     //滚动到当前节点                         $("#" + treeid).tree('select', node[i].target);       //高亮显示                         $("#" + treeid).tree('expand', node[i].target);       //高亮显示                         var p = $("#" + treeid).tree('getParent', node[i].target);       //高亮显示getParent                         $("#" + treeid).tree('expand', p.target);       //高亮显示                     }                 }             }             $("#" + textid).val(value);    //将选择的设备显示到搜索框中             $("#append").hide().html("");   //隐藏下拉框         }

    //输入事件     function getContent(obj, idtree) {         treeid = idtree;         textid = obj.id;         //获取tree的所有节点         var nodes = $("#" + treeid).tree('getChildren');         //获取输入的值         var kw = jQuery.trim($(obj).val());         if (kw == "") {             $("#append").hide().html("");             return false;         }         var html = "";         //匹配并动态加载到下拉框中         for (i = 0; i < nodes.length; i++) {             var treeId = nodes[i].id;             var treeName = nodes[i].text;

            if (treeName.indexOf(kw) >= 0) {                 //动态加载下拉框和数据                 html = html + "

" + treeName + "

";             }         }         if (html != "") {             $("#append").show().html(html);         } else {             $("#append").hide().html("");         }     }     //获取焦点事件     function getFocus(obj) {         $(".item").removeClass("addbg");         $(obj).addClass("addbg");     }     //单击事件     function getCon(obj, treeid) {         $("#" + textid).blur();     //失去焦点事件         var node = $("#" + treeid).tree('getChildren');    //获取Tree的所有节点         //$("#" + treeid).tree('expandAll', node.target);    //展开所有节点         var value = $(obj).text();        //获取文本框输入的内容

        //查找相应节点并滚动到该节点，高亮显示         for (i = 0; i < node.length; i++) {             //var treeId = node[i].id;             var treeName = node[i].text;             //找到相应的设备             if (treeName.indexOf(value) >= 0) {                 if (treeName == value) {                     //var nodes = $("#" + treeid).tree('find', treeId);   //找到当前的节点                     //$("#" + treeid).tree('scrollTo', node[i].target);     //滚动到当前节点                     $("#" + treeid).tree('select', node[i].target);       //高亮显示                     $("#" + treeid).tree('expand', node[i].target);       //高亮显示                     var p = $("#" + treeid).tree('getParent', node[i].target);       //高亮显示getParent                     $("#" + treeid).tree('expand', p.target);       //高亮显示                 }             }         }         $("#" + textid).val(value);    //将选择的设备显示到搜索框中         $("#append").hide().html("");   //隐藏下拉框     }

详细参考：http://blog.csdn.net/zlts000/article/details/47959173