如何使 jQuery Contains 不区分大小写，包括 jQuery 1.8+？

Posted 2023-02-23

【中文标题】如何使 jQuery Contains 不区分大小写，包括 jQuery 1.8+？

【英文标题】：How do I make jQuery Contains case insensitive, including jQuery 1.8+?

【发布时间】：2011-01-12 21:21:17

【问题描述】：

我正在尝试不区分大小写地使用“包含”。我尝试在以下 *** 问题中使用该解决方案，但没有成功：

Is there a case insensitive jQuery :contains selector?

为方便起见，这里复制解决方案：

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

这是错误：

Error: q is not a function
Source File: /js/jquery-1.4.js?ver=1.4
Line: 81

这是我使用它的地方：

  $('input.preset').keyup(function() 
    $(this).next().find("li").removeClass("bold");
    var theMatch = $(this).val();
    if (theMatch.length > 1)
      theMatch = "li:Contains('" + theMatch + "')";
      $(this).next().find(theMatch).addClass("bold");
    
  );

我在同一场景中使用原始区分大小写的“包含”没有任何错误。有没有人有任何想法？我会很感激的。

【问题讨论】：

如果有人感兴趣，我已经更新了我的blog post 三个额外的包含选择器:containsExact、:containsExactCase 和:containsRegex 选择器现在可以在所有版本的jQuery 中使用。跨度>

见css-tricks.com/snippets/jquery/…,

我认为 .filter() 是另一种好方法。 Reference

【参考方案1】：

这是我在当前项目中使用的，没有任何问题。看看你是否对这种格式有更好的运气：

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

---

在 jQuery 1.8 中，此 API 发生了变化，jQuery 1.8+ 版本为：

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

You can test it out here。有关 1.8+ 自定义选择器的更多详细信息，check out the Sizzle wiki here。

【讨论】：

你是一个救生员。谢谢。

你有没有机会谈谈这是在做什么？

@ClovisSix - 感谢您的提醒，我提供了一个 1.8+ 的方法，如果您有任何问题，请告诉我。

请注意，这不会替换 :contains 只是添加另一个选择器 :Contains。

选择器应该叫做icontains，或者类似的名字。

【参考方案2】：

值得注意的是，答案是正确的，但仅涵盖:Contains，而不是别名:contains，这可能会导致意外行为（或者设计用于需要敏感和不敏感搜索的高级应用程序）。

这可以通过复制别名的扩展名来解决：

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

我花了一段时间才弄清楚为什么它对我不起作用。

【讨论】：

我会在上面评论这个，但显然我不能。

我不确定你在这里得到什么。这会覆盖 :contains 的预期记录行为。我认为不理会原来的:contains 并调用您的新选择器:icontains 会更清楚。

这与我的帖子无关。创建替代选择器当然是一个有效的选择，但是我指出扩展 :contains，但忽略扩展 :Contains 可能会导致用户混淆，因为它们会产生不同的结果。

那么感谢您分享这个“陷阱”。 :) 尽管如此，我认为最好不要在构建非破坏性并行行为的工作量较少时覆盖内置行为。

我为此尝试了几种不同的解决方案，这个终于奏效了。谢谢。

【参考方案3】：

我会做这样的事情

     $.expr[':'].containsIgnoreCase = function (n, i, m) 
        return jQuery(n).text().toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
    ;

然后离开:contains一个人......

DEMO

那么为什么 jQuery 在它的库中不支持它？！如果就这么简单……

因为Does your code pass the turkey code?

【参考方案4】：

可能会迟到……但是，

我宁愿走这条路..

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

);

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

【参考方案5】：

我将允许自己添加我的朋友：

$.expr[":"].containsNoCase = function (el, i, m)  
    var search = m[3]; 
    if (!search) return false; 
    return eval("/" + search + "/i").test($(el).text()); 
; 

【参考方案6】：

我只是能够完全忽略 jQuery 的大小写敏感性来实现我想要使用下面的代码：

            $.expr[":"].contains = $.expr.createPseudo(function(arg) 
            return function( elem ) 
                return $(elem).text().toUpperCase().indexOf(arg.toUpperCase()) >= 0;
            ;
        );

您可以使用此链接根据您的 jQuery 版本查找代码以忽略区分大小写， https://css-tricks.com/snippets/jquery/make-jquery-contains-case-insensitive/

另外，如果你想使用 :contains 并进行一些搜索，你可能想看看这个：http://technarco.com/jquery/using-jquery-search-html-text-and-show-or-hide-accordingly