我正在做一个过滤的工作,我有大约50-100个列表项,每个项都有这样的标记:
<li>
<input type="checkbox" name="services[]" value="service_id" />
<span class="name">Restaurant in NY</span>
<span class="filters"><!-- hidden area -->
<span class="city">@city: new york</span>
<span class="region">@reg: ny</span>
<span class="date">@start: 02/05/2012</span>
<span class="price">@price: 100</span>
</span>
</li>
我创建这样的标记是因为我最初使用的是List.js。
我想做的是这样的搜索:@region: LA @price: 124
等等,问题是我也想显示多个项目,以便选择多个...一个:)
我假设这需要模糊搜索,但问题是我没有找到任何功能。
由于我有一个相当少量的项目,我想一个客户端的解决方案。
7条答案
按热度按时间7lrncoxx1#
我在javascript中寻找“模糊搜索”,但还没有找到解决方案,所以我写了自己的函数来做我需要的。
算法非常简单:循环检查针上的字母,并检查它们在干草堆中的出现顺序是否相同:
例如:
q1qsirdb2#
另一个(简单)的解决方案。不区分大小写,忽略字母顺序。
它对搜索词的每个字母进行检查,如果原始字符串包含该字母,它将向上计数(如果不包含,则向下计数),并根据匹配数/字符串长度的比率返回true或false。
示例:
d6kp6zgx3#
一年后,List.js得到了一个很好的fuzzy search插件,它工作得很好。
3qpi33ja4#
我对list.js并不满意,所以我创建了自己的list.js,这可能不是一个精确的模糊搜索,但我不知道该怎么称呼它,我只是想让它匹配一个查询,而不考虑我的单词在查询中的顺序。
请考虑以下场景:
下面是一个例子:
我希望这能帮上忙。
gg0vcinb5#
我有一个小函数,在数组中搜索字符串(至少对我来说,它产生了比levenshtein更好的结果):
yh2wf1be6#
我自己做了一个,它使用regex,更像是一个概念验证,因为它完全没有经过压力测试。
享受javascript模糊搜索/模糊匹配http://unamatasanatarai.github.io/FuzzyMatch/test/index.html
q1qsirdb7#
此处提供的解决方案返回
true/false
,但不包含有关哪个部分匹配、哪个部分不匹配的信息。在某些情况下,您可能需要知道它,例如,在搜索结果中将输入的部分内容加粗
我已经用 typescript 创建了自己的解决方案(如果您想使用它,我已经在这里发布了它-https://github.com/pie6k/fuzzystring),并在这里演示https://pie6k.github.io/fuzzystring/
其工作原理如下:
下面是完整的实现(Typescript)