Question

我正在为表格制作一个简单的排序搜索框。

我有以下代码：

<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#comment: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;
}});

似乎没有任何改变，我的搜索框仍然区分大小写...

Answer 1

在延长$以添加containsIgnoreCase之后，您应该在代码中使用containsIgnoreCase。试试这个。

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

Answer 2

您可以在这篇文章How do I make jQuery Contains case insensitive, including jQuery 1.8+?中找到答案。为方便起见，我将在此处复制粘贴解决方案，

使用

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

带有jQuery的表的简单不区分大小写的搜索框

2 个答案: