jquery 自动完成单词的任何部分

nbysray5  于 2023-08-04  发布在  jQuery
关注(0)|答案(2)|浏览(82)

我正在寻找的是显示建议不只是什么字开始,但如果它满足任何部分的话。

例如,如果我有一个单词列表[ Manimal,animal,person,erson]
当我键入animalani时,它应该同时显示Manimal和animal,或者如果我键入son,它应该同时显示person和son

我如何使用typeahead和bloodhound来实现这一点?

我试过了

var jobCodes = new Bloodhound({
  datumTokenizer: function (d) { return [d.JobName]; },
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  prefetch: "/api/jobservice/getjobcodes"
});

Or 

var jobCodes = new Bloodhound({
  datumTokenizer: function (d) { return Bloodhound.tokenizers.nonword(d.JobName); },
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  prefetch: "/api/jobservice/getjobcodes"

});

字符串

iq0todco

iq0todco1#

更新:您可以使用我的Bloodhound分支,它提供了一个简单的bool选项shouldStartAnyChar。您可能希望将它与另一个新标志shouldMatchAnyToken结合使用:
https://github.com/brass9/typeahead.js
你可以在JsDoc的源代码中看到它们:
https://github.com/brass9/typeahead.js/blob/master/src/bloodhound/search_index.js
上面的代码与10年前的版本兼容,但是,将部分代码移动了10年,特别是消除了MSIE回退。
如果你只是想使用10年前的原始Typeahead,请继续阅读:
这取决于你有多渴望使用Bloodhound,以及你愿意重写多少。
最简单的答案是通过使用remote基本上关闭95%的Bloodhound:

const bloodhound = new Bloodhound({
    remote: {
        url: '/searchjson?q=query',
        wildcard: 'query'
    }

字符串
然后在后端实现你想要的搜索方式,在短语的任何地方搜索,而不仅仅是开始。它会更慢,特别是在像手机这样的慢速网络上。
如果你必须让寻血猎犬完成它的主要工作,你就是在冒险。Bloodhound在幕后工作的方式是使用SearchIndex,它看起来像这样:
https://github.com/twitter/typeahead.js/blob/master/src/bloodhound/search_index.js
Bloodhound使用的两个部分是add函数,它将数据数组添加到其索引中:

add: function (data) {
    var that = this;
    data = $_.isArray(data) ? data : [data];
    $_.each(data, function (datum) {
        var id, tokens;
        that.datums[id = that.identify(datum)] = datum;
        tokens = normalizeTokens(that.datumTokenizer(datum));
        $_.each(tokens, function (token) {
            var node, chars, ch;
            node = that.trie;
            chars = token.split("");
            while (ch = chars.shift()) {
                node = node[CHILDREN][ch] || (node[CHILDREN][ch] = newNode());
                node[IDS].push(id);
            }
        });
    });
},


然后搜索,搜索里面的东西:

search: function search(query) {
    var that = this, tokens, matches;
    tokens = normalizeTokens(this.queryTokenizer(query));
    $_.each(tokens, function (token) {
        var node, chars, ch, ids;
        if (matches && matches.length === 0) {
            return false;
        }
        node = that.trie;
        chars = token.split("");
        while (node && (ch = chars.shift())) {
            node = node[CHILDREN][ch];
        }
        if (node && chars.length === 0) {
            ids = node[IDS].slice(0);
            matches = matches ? getIntersection(matches, ids) : ids;
        } else {
            matches = [];
            return false;
        }
    });
    return matches ? $_.map(unique(matches), function (id) {
        return that.datums[id];
    }) : [];
},


正如你可能已经注意到的,这是一个非常巧妙和非常复杂的过程。这是一个非常非常基本的数据库实现,完全用JavaScript实现,只有43行代码。这是相当令人印象深刻的,和一个很大的原因使用猎犬...
……也是你的主要挑战。SearchIndex构建一个节点树,看起来像:

Node = {
  i: [1, 5, 6, ...]
  c: ['a': Node, 'e': Node, ... ]
}


其中i是匹配的ID列表,如果你已经在树中找到了这个深度,c是索引中可能剩余的匹配字符的树。
您需要重写search方法,方法是稍微放慢它的速度,让它检查每个标记,而不仅仅是开始。
但是您会有一个额外的问题,即只重写一个方法并没有添加定制的故意方式。我认为你可以承认这段代码已经稳定了十年,并且可以放心地进行“猴子修补”,在那里你让一个对象初始化自己,然后在它可以对其进行操作之前尽可能少地用你自己的代码替换。
初始化寻血猎犬示例后:

const bloodhound = new Bloodhound({ ... });


在源代码中,它将.index设置为SearchIndex示例。你可以像这样使用Monkey-Patch:

bloodhound.index.search = query => { ...


不过,你会面临相当大的挑战,因为SearchIndex在它的类闭包中隐藏了几个私有方法,比如getIntersection和normalizeTokens,你必须将其复制到代码中。

bz4sfanl

bz4sfanl2#

创建/获取要检查的字符串数组,然后定义一个函数,该函数将字符串数组作为第一个参数,子字符串作为第二个参数。
然后创建一个空数组,如果有结果,它将保存结果。
循环遍历数组中包含的每个字符串,如果其中任何字符串包含子字符串,则将该字符串推入结果数组。
最后,如果有结果,返回它们。否则返回“no results”。

var phrases = ["lazy", "little", "laughing", "ladies"];
var checkStringsForSubString = function(str, subStr) {
    var results = [];
    for (var i = 0; i < phrases.length; i++) {
        if (str[i].indexOf(subStr) != -1) {
            results.push(str[i]);
        }
    }
    if (results.length > 0) {
        return results;
    } else {
        return "no results";
    }
};
checkStringsForSubString(phrases, "la");

字符串

相关问题