Büyük / küçük harfe duyarlı olmayan bir jQuery: içerir seçici var mı?

: Contains jQuery seçicisinin büyük / küçük harfe duyarlı olmayan bir sürümü var mı, yoksa tüm öğeleri döngüye alarak ve .text () 'i dizemle karşılaştırarak işi manuel olarak mı yapmalıyım?

JQuery 1.2 için yaptığım şey:

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

Bu, jquery'yi bir: Büyük / küçük harfe duyarlı olmayan bir seçici içerir,: içerir seçicisi değişmeden kalır.

Düzenleme: jQuery 1.3 (teşekkürler @ user95227) ve sonrası için ihtiyacınız olan

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

Düzenleme: Görünüşe göre DOM'a doğrudan erişim

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

onun yerine

jQuery(a).text()

Önceki ifadede bunu önemli ölçüde hızlandırır, bu nedenle hız önemliyse kendi sorumluluğunuzda deneyin. ( @John 'un sorusuna bakın )

Son düzenleme: jQuery 1.8 için şöyle olmalıdır:

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

İsteğe bağlı olarak büyük / küçük harfe duyarlı olmamak için: 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;
  }
});

o zaman :containsiyerine kullanın:contains

JQuery 1.3'ten itibaren bu yöntem kullanımdan kaldırılmıştır. Bunun çalışması için bir işlev olarak tanımlanması gerekir:

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

Birisi (benim gibi) ilgileniyorsa , İçerir tanımında a ve m [3] ne anlama gelir ?

ANAHTAR / AÇIKLAMALAR: jQuery tarafından seçici tanımlarında kullanılmak üzere sunulan parametreler:

r = jQuery incelenmekte olan öğeler dizisi. (örneğin: r.length = Eleman sayısı)

i = r dizisi içinde şu anda incelenmekte olan öğenin dizini .

a = öğesi şu anda inceleniyor. Seçici ifadesi, onu eşleşen sonuçlarına dahil etmek için true döndürmelidir.

m [2] = aradığımız düğümAdı veya * (iki nokta üst üste).

m [3] = param: seçiciye (param) geçirildi. Tipik olarak : nth-of-type (5) ' deki gibi bir dizin numarası veya : color (blue) gibi bir dize .

JQuery 1.8'de kullanmanız gerekecek

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

Biraz daha hızlı performans gösteren ve normal ifadelere de izin veren bir varyasyon :

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);
    }
);

Bu yalnızca büyük / küçük harfe duyarlı olmakla kalmaz, aynı zamanda aşağıdaki gibi güçlü aramalara da olanak tanır:

• $("p:containsCI('\\bup\\b')") ("Yukarı" veya "yukarı" ile eşleşir ancak "yukarı", "uyandırma" vb. İle eşleşmez.)
• $("p:containsCI('(?:Red|Blue) state')") ("Kırmızı durum" veya "mavi durum" ile eşleşir ancak "yukarı durum" vb. İle eşleşmez)
• $("p:containsCI('^\\s*Stocks?')") ("Hisse senedi" veya "hisse senetleri" ile eşleşir, ancak yalnızca paragrafın başlangıcında (baştaki herhangi bir boşluk yok sayılır).)

Geç olabilir ... ama,

Bu yoldan gitmeyi tercih ederim ..

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

Bu şekilde, DO NOT jQuery'nin YERLİ ile kurcalamaya ' .Contains' Sen tahrif varsayılan bir sonraki ..., geri kendinizi bulabilirsiniz gerekebilir ... StackOverflow'daki ...

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

Güncelleme kodu 1.3'te harika çalışıyor, ancak "içerir" ifadesi önceki örnekten farklı olarak ilk harfte küçük harf olmalıdır.

Bir HTML kodundan gelen büyük / küçük harfe duyarlılığı yok sayan metni bulmak için ": içerir" ifadesini kullanmak için aşağıya bakın,

 $.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");
          }              
        });

Bu bağlantıyı, jquery sürümünüze göre kodu yok sayan durumu bulmak için de kullanabilirsiniz, Make jQuery: Büyük / Küçük Harfe Duyarlı Değildir

Normal ifadeler kullanan daha hızlı bir sürüm.

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

Aşağıdaki çalışmama ile benzer bir sorun yaşadım ...

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

Bu, bir uzantıya ihtiyaç duymadan çalışır

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

Bu da işe yarıyor, ancak muhtemelen "manuel döngü" kategorisine giriyor ...

$('div.story span.Quality').contents().filter(function()
{
  return !/flac/i.test(this.nodeValue);
}).parent().css("background-color", 'yellow');

Yeni bir değişken Ben ona subString adını veriyorum ve bazı elemanlar metninde aramak istediğiniz dizgeyi koyuyorum. Sonra Jquery seçici kullanarak örneğim gibi ihtiyacınız olan öğeleri seçin $("elementsYouNeed")ve buna göre filtreleyin .filter(). İçinde .filter()her bir öğeyi $("elementsYouNeed")işlevle karşılaştıracaktır.

İ .toLowerCase()element metni için kullanma işlevinde ayrıca büyük / küçük harfe duyarlı koşulu önleyebilen ve içinde bir alt dizge olup olmadığını kontrol edebilen subString. Bundan sonra .filter()yöntem, eşleşen öğelerin bir alt kümesinden yeni bir jQuery nesnesi oluşturur.

Artık matchObjects'teki eşleştirme öğelerini alabilir ve istediğinizi yapabilirsiniz.

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

var matchObjects = $("elementsYouNeed").filter(function () {return $(this).text().toLowerCase().indexOf(subString) > -1;});