2012-03-01 2 views
16

div의 제목을 기준으로 div를 필터링해야하는 텍스트 입력 검색이 있습니다. 다음은 작동하지 않는 코드입니다.텍스트 검색을 기준으로 div 표시

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

무엇이 잘못 되었나요?

편집 : 변수 txt는 사용자가 입력 필드에 입력 한 것입니다.

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

답변

41

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

documentation for :contains() Selector

바이올린 예를보십시오 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/

+0

위의 추가 설명을 참조하십시오. 나는 div 안에있는 텍스트를 평가하려고합니다. –

+0

님이 대답을 업데이트했습니다. 그걸 확인하십시오. –

+0

그 중 대부분은 효과가 있습니다. 대소 문자를 구분하지 않는 방법이 있습니까? –

0

다행히 jQuery를이 Contains 선택이 있습니다 :

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

find 방법은 매개 변수로 JQuery와 선택기를 취 예는 TXT가 차 있다면 나는이 행 표시 할 것입니다 것입니다. 귀하의 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(); 
}); 
0

(가) 사업부에서 첫 A HREF에서 텍스트 만에 대소 문자를 구별하고, 일치해야 다음

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

필터 제공 show()를 적용하기 위해 그 함수에서 true를 반환하는 요소 목록.
필터 함수의 반환 값은 "이 요소의 첫 번째 앵커 요소의 경우 내용을 가져 와서 패턴과 일치시키고 결과 배열에 하나 이상의 결과가 있으면 true를 반환합니다.

패턴의 끝에있는 "i"는 대소 문자를 구분하지 않습니다.

관련 문제