jQuery wybierz tylko tr/td w głównej tabeli, a nie zagnieżdżonych tabelach.

Question

Obecnie mam tabelę z tabeli zagnieżdżonej w nim:

<table class="datagrid" id="report"> 
     <thead> 
     <tr> 
      <th>item1</th> 
      <th>item2</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr class="odd"> <-- on click from this level only 
     <td></td> 
     <td></td> 
     </tr> 
     <tr> 
     <td colspan="2"> 
     <table> 
      <tr class="odd"> <-- not to be fired here 
      <td></td> 

etc strukturę tabeli.

Obecnie używam następującego jQuery, który uruchamia się na każdym tr niezależnie od poziomu tabeli. Jak mogę go zmienić, aby strzelał tylko na pierwszym poziomie?

$(document).ready(function(){ 
      $("#report tr:not(.odd)").hide(); 
      $("#report tr:first-child").show(); 

      $("#report tr.odd").click(function(){ 
       $(this).next("#report tr").fadeToggle(600); 
      }); 
     }); 

Answer 1

Użyj child selector > aby wybrać tylko te tr elementy, które są dzieckiem raport stołu tbody, na przykład:

$("#report > tbody > tr.odd") 

Answer 2

Chcesz

$("#report>tr") 

> oznacza bezpośredni potomek (child) zamiast dowolnego potomka.

Answer 3

użyć selektora > kierować tylko bezpośredni potomek elementu. Trzeba kierować niejawny elementu TBODY wewnątrz tabeli także:

$('#report>tbody>tr.odd') 

Answer 4

z tego rozwiązania to nie ma znaczenia, czy masz tag TBODY pomiędzy:

$('table').find('tr:first').parent().children()