2009-12-14 3 views
1

나는 몇 div의과 같이 있습니다jquery가있는 숫자가 포함 된 개체를 선택하는 방법은 무엇입니까?

<div>1</div> 
<div>2</div 

모든 방법

<div>11</div> 
<div>12</div> 

에 등등을.

는 내가 원하는하고있어, 이들 중 하나를 선택합니다과 같이 선택 JQuery와 있습니다 :

$('.ticketNumber:contains("1")').addClass('something'); 

물론이 문제는 그 숫자 1이 포함 된 div의 중 하나를 선택하는 것입니다

그리고 오직 하나만 포함하는 것이 아닙니다.

그렇다면 jquery가 와일드 카드 유형이 아닌 정확한 선택을 수행하는 방법은 무엇입니까?

+0

선택할 수있는 유일한 방법입니까? ': nth-child()'또는': nth-of-type()'selector는 어떨까요? – Gumbo

+0

당신의 의견은 내가 간단하게 사용할 수 있다는 것을 깨닫게했다 : eq(). 고마워요. – willdanceforfun

+0

> micahwittman

답변

4

당신은 선택을 확장 할 수 있습니다

$.extend($.expr[':'],{ 
    containsNumber: function(a,i,m) { 

    var text = $(a).text(); 

    return parseInt(text) == parseInt(m[3]); 
    } 
}); 

확장 선택기를 사용할 수 있습니다.

$('.ticketNumber:containsNumber(1)').addClass('something'); 
+0

흥미 롭습니다. 그러나 결코하지 말아야한다. – willdanceforfun

+2

매우 일반적인 시나리오는 아니지만, ''은 다음과 같이 일치 할 것이다 :'$ ("span : containsNumber (31)")'. 항상 두 번째 매개 변수를'parseInt'에 추가하십시오! 예 :'parseInt (m [3], 10)' – nickf

+0

@ q8-coder. 아주 잘 했어. 검색 표현식을 확장 할 수 있다는 것을 알지 못했습니다. –

1

filter은 쉬운 옵션이지만 조금 더 빨리 처리하기 위해 사전 처리 할 수 ​​있습니다.
이 코드는 쉽게 액세스 할 수 있도록 티켓 배열을 만들었습니다. 그들은 자주 변경하고, 작은 수 있습니다 (그렇지 않으면 배열이 너무 큰 것입니다,하지만 당신은 쉽게 연관 배열로 전환 할 수 있습니다)하지 않으면이 좋다 :

var tickets = []; 

$(function(){ 
    $('div').each(function(){ 
    var div = $(this); 
    var n = parseInt(div.text(), 10); 
    tickets[n] = div; 
    }); //div.each 

    tickets[12].css('color', 'red'); 
}); //doc.ready 

다음 옵션은 덜 인기가 있지만, 잘 작동합니다. jQuery는 내부적으로 비슷한 일을합니다. 여기서는 attr을 사용하여 맞춤 속성을 추가하고이를 선택합니다 (성가신 경우 ticket12과 같은 클래스를 추가하거나 표준 속성 사용).

$(function(){ 
    $('div').each(function(){ 
    var div = $(this); 
    var n = div.text(); 
    div.attr('ticket', n); 
    }); //div.each 

    $('[ticket=3]').css('color', 'blue'); 
}); //doc.ready 

여기에 행동 두 예제를 참조하십시오 : 이것은 당신의 페이지에 많은 변화를 만들 경우 배열보다 유지하는 것이 더 쉽습니다 http://jsbin.com/etapu3

관련 문제