У меня в настоящее время есть таблица с вложенной таблицей в нем:
<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>
и т.д. структура таблицы.
Я в настоящее время использую следующий jQuery, который стреляет в каждый tr
независимо от уровня таблицы. Как я изменяю его, чтобы только стрелять в первый уровень?
$(document).ready(function(){
$("#report tr:not(.odd)").hide();
$("#report tr:first-child").show();
$("#report tr.odd").click(function(){
$(this).next("#report tr").fadeToggle(600);
});
});
Используйте дочерний селектор >
, чтобы выбрать только те tr
элементы, которые являются дочерними для report таблицы tbody
, например:
$("#report > tbody > tr.odd")
Вы используете селектор >
для указания только прямого потомка элемента. Вам также нужно нацелить неявный элемент tbody внутри таблицы:
$('#report>tbody>tr.odd')
Вы хотите
$("#report>tr")
В >
имеется в виду прямой потомок (ребенок), а не любой потомок.