テキスト検索に基づいてdivを表示する

Question

divのタイトルに基づいてdivをフィルタリングするテキスト入力検索があります。ここには動作していないコードがあります：

$('.contact-name').each(function(){ 
    var txt = $('#search-criteria').val(); 
    $('this').find(txt).show()  
}); 

私は間違っていますか？

EDIT： 変数txtを明確にするために、ユーザーが入力フィールドに入力したものがあります。例では、TXTちゃだった場合、私はこの行を表示するようにしたいと思うだろう：

$('.contact-name').each(function(){ 
    var txt = $('#search-criteria').val(); 
    $(this).find('div:contains("'+txt+'")').show()  
}); 

Answer 1

この

var txt = $('#search-criteria').val(); 
$('.contact-name:contains("'+txt+'")').show(); 

documentation for :contains() Selector

フィドルの例を試してみてくださいCASE INSE NSITIVE：

var txt = $('#search-criteria').val(); 
$('.contact-name').each(function(){ 
    if($(this).text().toUpperCase().indexOf(txt.toUpperCase()) != -1){ 
     $(this).show(); 
    } 
}); 

フィドル例：http://jsfiddle.net/WBvTj/4/

Answer 2

幸いにもjQueryのは、Containsセレクタを持っています。あなたのsearch_criteriaテキスト入力にそれが含まれているのではないかと思います。それはDIVのタイトルのいくつかの部分文字列が含まれますと仮定すると、これを試してみてください。http://jsfiddle.net/WBvTj/2/

UPDATE：

var txt = $('#search-criteria').val();  
$('.contact-name').each(function(i, e){ 
    if($(e).attr("title").indexOf(txt)>=0) $(e).show(); 
}); 

Answer 3

findメソッドは、パラメータとしてjQueryのセレクタを取ります

<div class="contact-name"><h3><a href="##">Charles Smith</a></h3></div> 

Answer 4

次は大文字と小文字を区別しないこと、およびdivの中に最初のHREFのテキストにのみ一致する必要があります：

var pattern = "/" + $('#search-criteria').val() + "/i"; 
$('.contact-name').filter(function() { 
    return $(this 'a:first-child').html().match(pattern).length > 0; 
}).show(); 

フィルタができますshow（）を適用するためにその関数からtrueを返す要素のリストを返します。
フィルタ関数の戻り値は、 "この要素の最初のアンカー要素の場合は内容を取り、パターンと一致させ、結果の配列に1つ以上の結果が含まれている場合はtrueを返します。"

パターンの最後にある "i"は、大文字と小文字を区別しない一致を得るためのものです。