Apakah ada case jQuery yang tidak sensitif: mengandung pemilih?

Apakah ada versi case sensitif dari : berisi pemilih jQuery atau haruskah saya melakukan pekerjaan secara manual dengan mengulang semua elemen dan membandingkan .text () ke string saya?

Apa yang akhirnya saya lakukan untuk jQuery 1.2 adalah:

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

Ini akan memperluas jquery untuk memiliki: Berisi pemilih yang tidak peka huruf besar-kecil, pemilih: berisi tetap tidak berubah.

Sunting: Untuk jQuery 1.3 (terima kasih @ user95227) dan nanti Anda butuhkan

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

Sunting: Rupanya mengakses DOM secara langsung dengan menggunakan

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

dari pada

jQuery(a).text()

Dalam ungkapan sebelumnya, tingkatkan kecepatannya jadi cobalah risiko Anda sendiri jika kecepatan adalah masalah. (lihat @ John 's pertanyaan )

Suntingan terbaru: Untuk jQuery 1.8 seharusnya:

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

Untuk membuatnya opsional case-sensitive: 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;
  }
});

lalu gunakan :containsisebagai ganti:contains

Pada jQuery 1.3, metode ini sudah usang. Agar ini berfungsi, harus didefinisikan sebagai fungsi:

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

Jika seseorang (seperti saya) tertarik dengan arti a dan m [3] dalam definisi Berisi .

KEY / LEGENDA: Params disediakan oleh jQuery untuk digunakan dalam definisi pemilih:

r = jQuery array elemen yang diteliti. (mis: r.length = Jumlah elemen)

i = indeks elemen yang sedang diteliti, dalam array r .

a = elemen saat ini sedang dalam pengawasan. Pernyataan pemilih harus mengembalikan true untuk memasukkannya dalam hasil yang cocok.

m [2] = nodeName atau * yang kita cari (kiri dari titik dua).

m [3] = param diteruskan ke: selector (param). Biasanya nomor indeks, seperti pada : n-of-type (5) , atau string, seperti dalam : warna (biru) .

Di jQuery 1.8 Anda harus menggunakan

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

Variasi yang tampaknya berkinerja lebih cepat dan yang juga memungkinkan ekspresi reguler adalah:

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

Tidak hanya case-insensitive, tetapi ini memungkinkan pencarian yang kuat seperti:

• $("p:containsCI('\\bup\\b')") (Cocokkan "Naik" atau "naik", tetapi bukan "atas", "bangun", dll.)
• $("p:containsCI('(?:Red|Blue) state')") (Cocokkan "red state" atau "blue state", tetapi bukan "up state", dll.)
• $("p:containsCI('^\\s*Stocks?')") (Cocokkan "stok" atau "stok", tetapi hanya pada awal paragraf (mengabaikan spasi putih terkemuka).)

Mungkin terlambat .... tapi,

Saya lebih suka pergi dengan cara ini ..

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

Dengan cara ini, Anda TIDAK mengutak-atik jQuery's NATIVE '.contains' ... Anda mungkin memerlukan yang default nanti ... jika diubah, Anda mungkin menemukan diri Anda kembali ke stackOverFlow ...

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

Kode pembaruan berfungsi baik dalam 1.3, tetapi "mengandung" huruf kecil pada huruf pertama tidak seperti contoh sebelumnya.

Lihat di bawah untuk menggunakan ": berisi" untuk menemukan teks yang mengabaikan sensitivitas case-nya dari kode 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");
          }              
        });

Anda juga dapat menggunakan tautan ini untuk menemukan kode pengabaian case berdasarkan versi jquery Anda, Make jQuery: mengandung Case-Insensitive

Versi yang lebih cepat menggunakan ekspresi reguler.

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

Saya memiliki masalah serupa dengan yang berikut ini yang tidak berfungsi ...

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

Ini berfungsi dan tanpa perlu perpanjangan

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

Ini juga berfungsi, tetapi mungkin termasuk dalam kategori "pengulangan manual" ....

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

Variabel baru saya beri nama subString dan masukkan string yang ingin Anda cari di beberapa elemen teks. Kemudian menggunakan elemen pilih pemilih Jquery yang Anda butuhkan seperti contoh saya $("elementsYouNeed")dan filter oleh .filter(). Di .filter()dalamnya akan membandingkan setiap elemen $("elementsYouNeed")dengan fungsi.

Dalam fungsi yang saya gunakan .toLowerCase()untuk elemen teks juga subString yang dapat menghindari kondisi case sensitif dan memeriksa apakah ada subString di dalamnya. Setelah itu .filter()metode membangun objek jQuery baru dari subset elemen yang cocok.

Sekarang Anda bisa mendapatkan elemen kecocokan di matchObjects dan melakukan apa pun yang Anda inginkan.

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

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