javascript - 如何使用数组对比实现前台模糊搜索？

问题描述

问 题

之前已经实现了前台精确搜索，现在需要改为模糊搜索

现有页面解析

1. 表格数据来自获取于后台存储在前台的 json 数据，需要完成前台分页，前台模糊搜索

2. 前台分页的实现方法：

   • 表格数据不是很多，一般不超过100个

   • 每个 tr 高度为 40px，页总高度为 400px

   • 设置 tbody 的 position 为 absolute，top 为 0px

   • 下一页上一页为改变 tbody 的 top 值，达到分页的感觉

3. 前台搜索的实现方法：

   • 获取输入框的值，循坏表格 tr 进行对比，不相等则删除，刷新分页组件

if(!(factorVal == $val && factorValDesc == '' || factorVal == '' && factorValDesc == $desc || factorVal == $val && factorValDesc == $desc)) {
    $(this).remove(); // 删除不满足搜索条件的 tr
    elementViewPagination(); // 重新载入分页组件
}

问题

如何改为模糊搜索？

补充

我有一个思路，不知是否恰当。

使用 split() 拆分字符串，将 输入框的值 与 表格项的值 转化为 数组，然后两个数组进行比对，例如：

var a = "输入框的值";
var b = "表格项 1 的值";
var c = "表格项 2 的值";
var d = "表格项 3 的值";
var e = "表格项 4 的值";

a = [1,2,3];
b = [1,2,3];
c = [1,2,3,4];
c = [1,2,4,5];
d = [4,5,6,7,8];

用 a 与 b、c、d 逐个进行比较：

1. a 与 b 含有相同元素，并且元素个数一样，排第一

2. a 与 c、d 含有相同元素，但元素个数不一样，按相同元素数量来进行排序

3. a 与 d 不含有相同元素，移除

疑惑

这样是否合理？或者有更好的办法，请在评论区留言告诉我，谢谢！

因为第一次接触前台搜索，如果有不恰当或者不正确的地方，欢迎大家指出来，麻烦了，谢谢！

解决方案

想法稍微有了偏差，使用 Index of 判断包含关系就好了。

这篇关于javascript - 如何使用数组对比实现前台模糊搜索？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！