如何使用jQuery实现不区分大小写的表格搜索功能?
不区分大小写表格搜索实现方案
你当前的匹配逻辑默认大小写敏感,仅需要将待对比的两组字符串统一转为全小写或全大写后再做包含判断,即可实现不区分大小写的匹配:
- 将用户输入的搜索值调用
toLowerCase()转为全小写 - 将从表格单元格取到的待匹配文本也调用
toLowerCase()转为全小写 - 对转成相同大小写格式的两个字符串执行包含判断即可
修改后的完整代码如下:
$("#search_input").keyup(function() { // 搜索值统一转小写 var value = this.value.toLowerCase(); $("#table").find(".table_row").each(function(index) { // 跳过表头行 if (!index) return; var id = $(this).find(".table_cell").first().text(); // 待匹配表格内容也转小写后再判断 $(this).toggle(id.toLowerCase().indexOf(value) !== -1); }); });
如果你偏好统一转大写的处理方式,把所有toLowerCase()替换为toUpperCase()即可,效果完全一致。
内容的提问来源于stack exchange,提问作者user17225961
相关产品推荐
相关产品推荐

