jQuery 다중 선택 : nth-child()

Question

이것은 내 테이블이며, tr 및 td를 사용합니다.

NAME Address CITY STATE 
ABC 123 A  CA 
AB8 123 B  CA 
AFC 456 B  TX 
POI 985 C  KJ 

문서 준비가 완료되면 문서가 모두 숨겨집니다.

가 지금은 라인이 모두 그럴 유무 보여주고 싶은 : -> 칼럼 (4) = CA "및"열 (3) = B

나는 피곤 내 코드 :

$("table[id=maintablex] tr td:nth-child(4):contains('CA'), table[id=maintablex] tr td:nth-child(3):contains('B')").closest('tr').show(); 

을하지만, 그것은 모든 것을 보여줍니다 (4) = CA, (3) = B ... 내 코드는 "OR"이었습니다.

추가 FULL HTML 코드 :

<table id="table"> 
    <tr> 
     <td>ABC</td> 
     <td>123</td> 
     <td>A</td> 
     <td>CA</td> 
    </tr> 
    <tr> 
     <td>ABC</td> 
     <td>1234</td> 
     <td>B</td> 
     <td>CA</td> 
    </tr> 
    <tr> 
     <td>AUF</td> 
     <td>123</td> 
     <td>C</td> 
     <td>TX</td> 
    </tr> 
    <tr> 
     <td>ABC</td> 
     <td>456</td> 
     <td>B</td> 
     <td>TX</td> 
    </tr> 
</table> 
<script language="Javascript"> 
$("table[id=table] tr").hide(); 

// Code show here 


</script> 

내가 보여주고 싶은 그 결과는 다음과 같습니다

$("table[id=maintablex] tr td:nth-child(3):contains('B')", 
    $("table[id=maintablex] tr td:nth-child(4):contains('CA')") 
).closest('tr').show(); 

---

I :

AB8 123 B  CA 

Answer 1

가 왜 이런 식으로하지 이것이 더 빠르지는 모르지만 @Jasper의 응답을 기반으로하면 HY이 작업을 수행하지 : 여기

//select the table, find all `<td>` elements that contain `CA` and iterate through each of them 
$('#table') 
    .find('td:nth-child(4):contains("CA")') 
    .closest('tr') 
    .find('td:nth-child(3):contains("B")') 
    .closest('tr') 
    .addClass('active'); 

는 jsfiddle입니다 : http://jsfiddle.net/KQMXe/

Answer 2

JS--

//select the table, find all `<td>` elements that contain `CA` and iterate through each of them 
$('#maintablex').find('td:nth-child(4):contains("CA")').each(function (index, value) { 

    //un-hide the parent `<tr>` element of this `<td>` by adding the `active` class to the `<tr>` 
    $(this).parents('tr:first').addClass('active'); 
}); 

CSS--

/*Hide all the table rows by default*/ 
tr { 
    display : none; 
} 

/*declare a class that shows the table rows when added to them*/ 
tr.active { 
    display : table-row; 
} 

UPDATE

위의 코드를 업데이트하여 각 행의 세 번째 열만 찾습니다 (이전에 그 부분을 생략했습니다). 귀하의 첫 번째 선택은 항상 주 = CA 어디가 주 = B. 나는 두 조각으로이 휴식 할 행과 일치하는 것입니다 http://jsfiddle.net/jasper/Mp7Jq/3/

Answer 3

:

는 여기 jsfiddle입니다. ...이 코드를 테스트하지 않았하지만 당신이 가까이해야

var stateRows = ("#maintablex tr td:nth-child(4):contains('CA')").parent(); 
var matchRows = stateRows.find("td:nth-child(3):contains('B')").parent(); 

matchRows.doWhateverYouLikeWithTheResults(); 

Answer 4

이 도움이

$.each($('table#table tr td:nth-child(4):contains("CA")').parent(),function(){ 
    if(($.inArray(this, $('table#table tr td:nth-child(3):contains("B")').parent())) > -1){ 
     $(this).show(); 
    } 
}); 

희망을 봅니다. :)