Ответ 1
Используйте дочерний селектор >
, чтобы выбрать только те элементы tr
, которые являются дочерними элементами таблиц отчетов tbody
, для пример:
$("#report > tbody > tr.odd")
В настоящее время у меня есть таблица с вложенной таблицей:
<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
, которые являются дочерними элементами таблиц отчетов tbody
, для пример:
$("#report > tbody > tr.odd")
с этим решением не имеет значения, есть ли у вас тег tbody между:
$('table').find('tr:first').parent().children()
Вы используете селектор >
для нацеливания только прямого потомка элемента. Вы также должны настроить таргетинг на неявный элемент tbody внутри таблицы:
$('#report>tbody>tr.odd')
Вы хотите
$("#report>tr")
>
означает прямой потомок (дочерний элемент), а не любой потомок.