jQuery: शामिल() चयनकर्ता अपरकेस और छोटे अक्षरों मुद्दा

Question

मेरे एचटीएमएल मेरी js

$('#txt').keyup(function(){ 

    var txtsearch = $('#txt').val(); 
    var filt = $("div.link-item:contains('" + txtsearch +"')"); 

    $("div.link-item").css("display", "none") 
     .filter(filt) 
     .css("display", "block"); 

}); 

इस

<input id="txt" value=""></input> 

<div class="link-item">jK</div> 
<div class="link-item">JFOO</div> 

तरह लग रहा है मैं ग्राहक की ओर गतिशील सामग्री को फ़िल्टर करने के लिए देख रहा हूँ। जब मैं पूंजी जम्मू टाइप करता हूं, तो यह केवल दूसरा div देता है जबकि मैं सभी div प्राप्त करना चाहता हूं जिसमें ऊपरी या निचला मामला है या नहीं।

Answer 1

आप केस संवेदी हो या अपने खुद के चयनकर्ता बनाने के लिए .contains फिल्टर बदल सकते हैं।

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

यह एक नया चयनकर्ता बनाता है: icontains (या आप इसे नाम दे सकते हैं असंवेदनशील-होता है, या जो कुछ भी आपके फैंसी सूट)। यह उपयोग होगा ही है शामिल है के रूप में: $('div:icontains("Stack")'); से मेल होगा:

<div>stack</div> 
<div>Stack</div> 
<div>StAcKOverflow</div> 

या ओवरराइड मौजूदा .contains फिल्टर:

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

जगह में इस के साथ

,

$("div:contains('John')"); 

सभी का चयन करेंगे इनमें से तीन तत्व:

<div>john</div> 
<div>John</div> 
<div>hey hey JOHN hey hey</div> 

Answer 2

filter फ़ंक्शन का उपयोग क्यों न करें, और ऐसे फ़ंक्शन में पास करें जो केस असंवेदनशील रेगेक्स का उपयोग करता हो?

var filteredDivs = $("div.link-item").filter(function() { 
    var reg = new RegExp(txtsearch, "i"); 
    return reg.test($(this).text()); 
}); 

DEMO

Answer 3

मैं नहीं मानता कि वहाँ एक कच्चे चयनकर्ता के साथ यह करने के लिए एक तरीका है। contains चयनकर्ता केस संवेदनशील है और ऐसा कोई मामला असंवेदनशील संस्करण प्रतीत नहीं होता है। मुझे लगता है कि सबसे अच्छा तरीका एक फिल्टर है कि मैन्युअल रूप से वस्तु

var filt = function (unused) { 
    $(this).text().toLowerCase().indexOf(txtSearch.toLowerCase()) !== -1; 
}; 

Answer 4

प्रश्नों यहाँ मेरी योगदान है उपयोग करने के लिए है, आशा है कि यह मदद करता है :)

$('#txt').keyup(function() { 
    var query = $(this).val(); 
    $("div.link-item") 
     .hide() 
     .filter(':contains("' + query + '")') 
     .show(); 
}); 

:contains() selector केस संवेदी है।

मेल खाने वाला टेक्स्ट उस तत्व के वंशजों में से किसी एक में, या उसके संयोजन में चयनित तत्व के भीतर सीधे दिखाई दे सकता है। विशेषता मूल्य चयनकर्ताओं के साथ, के कोष्ठक के अंदर पाठ:() को नंगे शब्दों के रूप में लिखा जा सकता है या उद्धरण चिह्नों से घिरा हुआ है। टेक्स्ट में मिलान करने वाला केस होना चाहिए।

कोई भी demo भी बनाया यदि कोई इसे आज़माएं।

अद्यतन

क्षमा करें, अपने प्रश्न पढ़ने में भूलना चाहिए।

http://bugs.jquery.com/ticket/278 पर मिले इस jQuery अभिव्यक्ति नया चयनकर्ता कि असंवेदनशील मामले है बनाने के लिए और मैं अपने demo अपडेट किया गया।

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