2012-12-19 2 views
2

10 개의 이름으로 구성된 mySQL 데이터베이스에서 레코드 세트를 얻으면 jquery를 사용하여 첫 글자로 필터링 할 수 있습니다. 그러나 알파벳 글자마다 페이지에 링크가 있고 "결과"가없는 글자를 회색으로 표시하려면 어떻게해야합니까? 여기Jquery 필터 결과 회색으로 표시되지 않는 글자 A-Z

내가 현재 결과를 필터링하고 방법은 다음 예제의

$(document).ready(function() { 
    function filterResults(letter){ 
     $('p').hide(); 
     $('p').filter(function() { 
      return $(this).text().charAt(0).toUpperCase() === letter; 
     }).show(); 
    }; 
    filterResults('A'); 
    $('a').on('click',function(){ 
     var letter = $(this).html();    
     filterResults(letter);   
    }); 
}); 

바이올린은 여기에 있습니다 : http://jsfiddle.net/livinzlife/8UE6m/

는 내가 원하는 것은 회색이 될 불명 모든 문자입니다. 나는 그들을 위해 계산되지 않은 것을 선택하는 방법을 모른다.

답변

2
var $p = $('p'); 
$('a').addClass(function(){ 
    var a = this.textContent; 
    return $p.filter(function(){ 
     return this.textContent.charAt(0) === a 
    }).length ? 'green' : 'grey'; 
}); 

http://jsfiddle.net/zLxKU/

+0

끝내 주셔서 고마워요! – livinzlife

0

빠른 (가장 효율적이지) 방법 ... 같은 것

var letters = ""; 
//Change the selector below to be more specific 
//Go through <p>'s and get first letter 
$('p').each(function() { 
var aText = $(this).text().toUpperCase(); 
    //Guard against empty 
    letters += aText ? aText.substring(0,1) : ''; 
}); 
//Loop through the A's 
$('a').each(function() { 
    if(letters.indexOf($(this).text().toUpperCase()) < 1) { 
    //One way is to replace the anchor tag with a span, which can't be clicked 
    $(this).replaceWith('<span style="color:grey;">' + $(this).text() + '</span>'); 
    } 
}); 

아니 난 그냥 그것을 밖으로 부딪 혔어요부터 조각에 오류가있을이 있는지 확인합니다. 바라기를 당신은 아이디어를 얻는다. 각 단락 태그의 첫 글자를 잡고 문자열에 넣으십시오. 각 앵커 태그를 반복하고 텍스트를 가져 와서 우리가 만든 문자열에 문자열이 있는지 확인하십시오. 그렇지 않은 경우 스팬으로 바꾸십시오. 사용자가 스팬을 클릭하여 회색으로 표시 할 수 없습니다. 앵커 태그를 회색으로 변경하려면 위의 내용을 변경하고 클래스를 적용하십시오 (예 : $('a').addClass(...)).

거기에 JavaScript/LINQ 스크립트가 있습니다 (예 : '포함하지 않음'또는 'where'절을 사용). 그러나이를 사용하면 성능이 저하 될 수 있습니다.

2

당신은 (는 0-9 숫자 시나리오를 처리하지 않습니다 ,하지만 당신은 그것을 작동 할 수 있어야한다) http://jsfiddle.net/gaby/8UE6m/1/

에서이

function showSupported(){ 
    // get the first letter of each p element in an array 
    var supported = $('p').hide().map(function() { 
     return $(this).text().charAt(0).toUpperCase(); 
    }).get(); 

    // make array unique; 
    supported = $.grep(supported, function(v, k) { 
     return $.inArray(v, supported) === k; 
    }); 

    // find all a elements whose letter is not in the supported array 
    $('a').filter(function(){ 
     return $.inArray($(this).text(), supported) === -1; 
    }).addClass('grey'); // adding a class that makes them grey or whatever.. 
} 

데모 같은 방법을 사용할 수 있습니다

관련 문제