web-dev-qa-db-ja.com

大文字と小文字を区別しないjQuery：containsセレクターはありますか？

：contains jQueryセレクターの大文字と小文字を区別しないバージョンはありますか、またはすべての要素をループして、.text（）を文字列と比較することで手動で作業を行う必要がありますか？

javascriptjqueryjquery-selectors
139
Pat

私が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;
    };
});
119
Pat

オプションで大文字と小文字を区別しないようにするには： 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を使用します

102
montrealmike

JQuery 1.3以降、このメソッドは非推奨です。これを機能させるには、関数として定義する必要があります。

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

（私のような）誰かがaとm [3]に含まれる定義を含む。

KEY/LEGEND：セレクター定義で使用するためにjQueryによって使用可能になったパラメーター：

r=精査される要素のjQuery配列。 （例：r.length=要素数）

i=配列内の現在精査中の要素のインデックスr.

a=現在調査中の要素。 Selectorステートメントは、一致した結果に含めるためにtrueを返す必要があります。

m [2]= nodeNameまたは*探している（コロンの左側）。

m [3]= paramは：selector（param）に渡されます。通常、：nth-​​of-type（5）のようなインデックス番号、またはのような文字列：color（blue）。

37
Alexander Prokofyev

JQuery 1.8では、使用する必要があります

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

わずかに高速に実行されると思われるバリエーションと正規表現を許可は次のとおりです。

_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」と一致しますが、段落の先頭でのみです（先頭の空白は無視されます）。）
15
Brock Adams

遅れるかもしれませんが...

私はこのように行きたいです。

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

このように、あなたはDO NOT jQueryのNATIVE '。contains'を改ざんします...後でデフォルトのものが必要になるかもしれません。 ..改ざんされた場合、stackOverFlow ...

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

更新コードは1.3で問題なく機能しますが、「含む」は、前の例とは異なり、最初の文字を小文字にする必要があります。

6
user122879

以下を参照して "：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

4
Umesh Patil

私は次のものが機能しないという同様の問題を抱えていました...

// 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');
0
shao.lo

正規表現を使用した高速バージョン。

$.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());
};
0
rotaercz