147

是否存在不区分大小写的:contains jQuery 选择器版本，还是我应该通过遍历所有元素并将它们的 .text() 与我的字符串进行比较来手动完成工作？

4

12 回答 12

128

我最终为 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的问题）

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

jQuery.expr[":"].Contains = jQuery.expr.createPseudo(function(arg) {
    return function( elem ) {
        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
    };
});
于 2008-10-09T14:37:24.293 回答
107

使其可选择不区分大小写： 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

于 2011-02-08T17:11:46.117 回答
41

从 jQuery 1.3 开始，此方法已被弃用。为了让它工作，它需要被定义为一个函数：

jQuery.expr[':'].Contains = function(a,i,m){
    return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
};
于 2009-04-23T22:49:50.747 回答
39

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

KEY/LEGEND：由 jQuery 提供的可用于选择器定义的参数：

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

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

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

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

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

于 2008-10-10T05:06:30.857 回答
32

在 jQuery 1.8 中，您需要使用

jQuery.expr[":"].icontains = jQuery.expr.createPseudo(function (arg) {                                                                                                                                                                
    return function (elem) {                                                            
        return jQuery(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;        
    };                                                                                  
});
于 2012-08-24T16:40:39.990 回答
15

似乎执行得稍微快一些并且也允许正则表达式的变体是：

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')") （匹配“红色状态”或“蓝色状态”，但不匹配“向上状态”等）
  • $("p:containsCI('^\\s*Stocks?')") （匹配“stock”或“stocks”，但仅在段落的开头（忽略任何前导空格）。）
于 2012-07-04T09:26:18.683 回答
11

可能会迟到……但是，

我宁愿走这条路。。

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

这样，您就不会篡改 jQuery 的 NATIVE '.contains' ...稍后您可能需要默认的 ...如果被篡改，您可能会发现自己回到stackOverFlow ...

于 2013-05-27T16:05:57.100 回答
6 
jQuery.expr[':'].contains = function(a,i,m){
    return jQuery(a).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
};

更新代码在 1.3 中运行良好，但与前面的示例不同，“包含”在第一个字母上应该是小写的。

于 2009-06-15T01:20:02.060 回答
4

请参阅下文，使用 ":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 版本查找忽略大小写的代码， Make jQuery :contains Case-Insensitive

于 2016-01-11T11:06:28.473 回答
3

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

$.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());
};
于 2018-04-24T16:29:32.480 回答
0

我遇到了类似的问题，以下不起作用...

// This doesn't catch flac or Flac
$('div.story span.Quality:not(:contains("FLAC"))').css("background-color", 'yellow');

这有效，无需扩展

$('div.story span.Quality:not([data*="flac"])').css("background-color", 'yellow');

这也有效，但可能属于“手动循环”类别......

$('div.story span.Quality').contents().filter(function()
{
  return !/flac/i.test(this.nodeValue);
}).parent().css("background-color", 'yellow');
于 2016-04-03T22:56:36.573 回答
0

新建一个变量，我将其命名为 subString 并将您要搜索的字符串放入某些元素文本中。然后使用 Jquery 选择器选择您需要的元素，例如我的示例$("elementsYouNeed")并按.filter(). 在中.filter()它将比较每个元素$("elementsYouNeed")与函数。

在我.toLowerCase()用于元素文本的函数中，还有 subString 可以避免区分大小写的条件并检查其中是否有 subString。之后，该.filter()方法从匹配元素的子集构造一个新的 jQuery 对象。

现在您可以在 matchObjects 中获取匹配元素并做任何您想做的事情。

var subString ="string you want to match".toLowerCase();

var matchObjects = $("elementsYouNeed").filter(function () {return $(this).text().toLowerCase().indexOf(subString) > -1;});
于 2020-01-14T09:12:05.857 回答