简单的大小写不敏感的搜索框的一个表与jQuery

Simple case insensitive search box for a table with jQuery

本文关键字:一个 jQuery 大小写 简单 搜索      更新时间:2023-09-26

我正在尝试为一个表创建一个简单的排序搜索框。

我有以下代码:

<input name="search" />
<table id="content">
    <tr class="item"> (...) </tr>
    <tr class="item"> (...) </tr>
</table>
$(document).ready(function(){
    $('input[name="search"]').keydown(function(){
    $('tr.item:contains("' + $(this).val()+ '")').prependTo('#content');
});

这个可以正常工作,但是.contains()是区分大小写的。

如何使它不区分大小写?

我在网上找到了这个:

http://bugs.jquery.com/ticket/278评论:4

http://ericphan.info/blog/2009/3/4/jquery-13-case-insensitive-contains.html

,但当我添加以下代码:

$.extend($.expr[":"], {
  "containsIgnoreCase": function(elem, i, match, array) {
     return (elem.textContent || elem.innerText || "").toLowerCase().indexOf((match[3] || "").toLowerCase()) >= 0;
}});

一切似乎都没有改变,我的搜索框仍然区分大小写…

在扩展$以添加containsIgnoreCase之后,您应该在代码中使用containsIgnoreCase。试试这个。

$(document).ready(function(){
    $('input[name="search"]').keydown(function(){
    $('tr.item:containsIgnoreCase("' + $(this).val()+ '")').prependTo('#content');
});

你可以在这篇文章中找到你的答案,我如何使jQuery包含不区分大小写,包括jQuery 1.8+?为了方便,我将在这里复制粘贴解决方案,

使用

jQuery.expr[':'].Contains = function(a, i, m) { 
  return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0; 
};