jQuery Wählen Sie nur tr/td in der Haupttabelle, nicht verschachtelte Tabellen.

Question

Im Moment habe ich eine Tabelle mit einer geschachtelten Tabelle drin:

<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 Tabellenstruktur.

Ich verwende derzeit die folgende jQuery, die auf jedem tr unabhängig von der Tabellenebene ausgelöst wird. Wie ändere ich es, nur auf der ersten Ebene zu feuern?

$(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

Verwenden Sie die child selector > nur wählen diejenigen tr Elemente, die ein Kind des Bericht Tisch tbody, zum Beispiel sind:

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

Answer 2

Sie wollen

$("#report>tr") 

Die > bedeuten direkten Nachkommen (Kind), anstatt jeden Nachkommen.

Answer 3

Sie verwenden den > Wähler nur die direkte Nachkomme eines Elements zum Ziel. Sie haben das implizite tbody Element in der Tabelle auch zum Ziel: es spielt keine Rolle

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

Answer 4

mit dieser Lösung, ob Sie einen tbody-Tag in haben zwischen:

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