是否有一个不区分大小写的jQuery :contains选择器？

Question

是否有不区分大小写的版本 :contains jQuery选择器？还是我需要手动循环遍历所有元素，并将它们的 .text() 与我的字符串进行比较？

- Pat

---

对于 jQuery 8.1 +，请查看此答案。 - Praveen

那是1.8.1版本，不是8.1。 - TylerH

这里有一个很好的例子：https://dev59.com/OWoy5IYBdhLWcg3wD5_H。 - 劉鎮瑲

Answer 1

我最终为jQuery 1.2做的是：

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

这将扩展jQuery，使其具有不区分大小写的:Contains选择器，而:contains选择器保持不变。

编辑：对于jQuery 1.3（感谢@user95227），您需要：

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

编辑： 显然，通过使用

直接访问DOM

(a.textContent || a.innerText || "") 

代替

jQuery(a).text()

如果速度是一个问题，请谨慎尝试先前的表达式加快速度。（请参见@John的question）

最新编辑：对于jQuery 1.8，应该是：

jQuery.expr[":"].Contains = jQuery.expr.createPseudo(function(arg) {
    return function( elem ) {
        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
    };
});

- Pat

---

只是想让大家知道，@Pat和其他人为jQuery 1.3描述的解决方案也适用于1.4.3。 - Jim Ade

由于此处的链接已被删除，请转到@John的问题/答案链接：https://dev59.com/y0nSa4cB1Zd3GeqPMkzp - Mottie

这对于jQuery 1.8不起作用。请查看下面seagullJS的答案以获取更新版本- https://dev59.com/7XVC5IYBdhLWcg3wxEN1#12113443 - Matt Browne

Answer 2

要使其可选地不区分大小写： http://bugs.jquery.com/ticket/278

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

那么使用:containsi代替:contains

- montrealmike

---

对我来说，添加新功能比覆盖原有功能更好，我现在使用这个选项（效果很好）。 - GôTô

这应该添加到标准的jQuery库中。 - user482594

Answer 3

自jQuery 1.3版本以来，此方法已被弃用。为使其正常工作，需要将其定义为一个函数：

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

- user95227

Answer 4

如果有人（比如我）对于Contains（包含）的定义中a和m[3]是什么感兴趣。

---

关键词/图例：jQuery为选择器定义提供的参数：

r = 正在审查的jQuery元素数组。（例如：r.length = 元素数目）

i = 当前正在被审查的元素索引，位于数组r中。

a = 当前正在被审查的元素。选择语句必须返回true才能将其包含在匹配结果中。

m[2] = 我们正在寻找的nodeName或*（冒号左侧）。

m[3] = 参数传递到:selector(param)中。通常是一个索引数字，例如:nth-of-type(5)，或一个字符串，例如:color(blue)。

- Alexander Prokofyev

Answer 5

在jQuery 1.8中，您需要使用

jQuery.expr[":"].icontains = jQuery.expr.createPseudo(function (arg) {                                                                                                                                                                
    return function (elem) {                                                            
        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;        
    };                                                                                  
});

- seagullJS

---

运行得很完美，谢谢！刚刚升级到1.8后，这个东西就不起作用了。 - Andreas

谢谢更新。刚刚升级到JQuery 1.8后它就停止工作了。 - Wasim

Answer 6

似乎性能稍微更快，同时也允许使用正则表达式的一种变体是：

jQuery.extend (
    jQuery.expr[':'].containsCI = function (a, i, m) {
        //-- faster than jQuery(a).text()
        var sText   = (a.textContent || a.innerText || "");     
        var zRegExp = new RegExp (m[3], 'i');
        return zRegExp.test (sText);
    }
);

这不仅是不区分大小写，而且允许强大的搜索，例如:

• $("p:containsCI('\\bup\\b')") （匹配 "Up" 或 "up"，但不匹配 "upper"、"wakeup" 等）
• $("p:containsCI('(?:Red|Blue) state')") （匹配 "red state" 或 "blue state"，但不匹配 "up state" 等）
• $("p:containsCI('^\\s*Stocks?')") （匹配 "stock" 或 "stocks"，但仅在段落开头（忽略任何前导空白））

- Brock Adams

Answer 7

可能会晚一些... 但,

我更喜欢走这条路...

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

这样，你不要篡改jQuery的本机'contains'... 你以后可能需要默认设置...如果被篡改，你可能会发现自己回到stackOverFlow。

- ErickBest

Answer 8

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

更新代码在1.3版本中运行良好，但与先前示例不同，“contains”应该以小写字母开头。

- user122879

---

我认为他想要一个独特的函数，以便：contains和：Contains同时起作用。 - joshperry

":contains选择器保持不变。" - Harry B

Answer 9

请参考以下内容，使用“:contains”从HTML代码中查找文本（忽略大小写）：

请参考以下内容，使用“:contains”从HTML代码中查找文本（忽略大小写）：

 $.expr[":"].contains = $.expr.createPseudo(function(arg) {
            return function( elem ) {
                return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
            };
        });
        $("#searchTextBox").keypress(function() {
          if($("#searchTextBox").val().length > 0){
            $(".rows").css("display","none");
            var userSerarchField = $("#searchTextBox").val();
            $(".rows:contains('"+ userSerarchField +"')").css("display","block");
          } else {
            $(".rows").css("display","block");
          }              
        });

您还可以使用此链接根据您的 jQuery 版本查找忽略大小写的代码：使 jQuery :contains 不区分大小写。

- Umesh Patil

Answer 10

使用正则表达式的更快版本。

$.expr[':'].icontains = function(el, i, m) { // checks for substring (case insensitive)
    var search = m[3];
    if (!search) return false;

    var pattern = new RegExp(search, 'i');
    return pattern.test($(el).text());
};

- Howard

---

非常出色的工作！非常感谢。我相信这是对这个问题最好、最新的回答。 - mavrosxristoforos