Я пытаюсь выбрать определенную строку таблицы, чтобы скрыть ее с помощью jquery. Я пытаюсь объединить селектор с селектором.find(). вот структура таблицы:
<table class="form-table">
<tbody><tr>
<th><label for="email">email</th>
<td><input type="text" name="email" id="email" value="" class="regular-text">
</td>
</tr>
<tr>
<th><label for="url">url</label></th>
<td><input type="text" name="url" id="url" value="" class="regular-text code"></td>
</tr>
<tr>
<th><label for="aim">AIM</label></th>
<td><input type="text" name="aim" id="aim" value="" class="regular-text"></td>
</tr>
</tbody></table>
что я собираюсь сделать, сначала выберите таблицу и сделайте все строки с дисплеем: none:
$('.form-table tbody tr').find().css('display', 'none');//here i got stuck with finding the right form
и появляется только правая строка (в моем случае мне нужен адрес электронной почты)
$('.form-table tbody tr').find().first-child().css('display', 'block');
он нуждается в полировке, но моя главная задача - найти раздел. есть идеи?
EDIT: я забыл написать, у меня есть несколько таблиц с тем же классом, и мне нужно выбрать правильный. в соответствии с атрибутом for в метке.
Вам не требуется find()
- чтобы скрыть все, что вы можете сделать:
$('.form-table tbody tr').css('display', 'none');
Или
$('.form-table tbody tr').hide();
Чтобы показать первое, вы можете использовать:
$('.form-table tbody tr').first().show();
РЕДАКТИРОВАТЬ
И, чтобы показать определенную строку, вы можете сделать:
$('.form-table tbody tr td input[name="aim"]').parent().parent().show();
Это немного неуклюжий и склонный к взлому, но он должен работать - было бы лучше, если бы вы могли дать идентификаторы элементам tr
.
EDIT 2 В ответ на ваши изменения...
Вы можете скрыть таблицу с заданным элементом (id = aim
) следующим образом:
$('.form-table tbody tr td input#aim').parent().parent().parent().children().hide();
а затем показать одну строку (id = aim
) следующим образом:
$('.form-table tbody tr td input#aim').parent().parent().show();
Чтобы скрыть элементы, вы можете использовать .hide()
.
И вы неправильно использовали .find()
. Желательно, чтобы вы прочли его документацию.
Следующий код выбирает все строки таблицы и фильтрует первый, затем скрывает оставшиеся строки (второй и более).
$('.form-table > tbody > tr').not(':first-child').hide();
Вы можете скрыть все строки следующим образом:
$('.form-table tbody tr').hide();
если поле электронной почты будет первой строкой, вы можете показать это следующим образом:
$('.form-table tbody tr').first().show();
Если вам нужна определенная таблица, вы должны просто указать идентификаторы таблиц и использовать селектор id, вам будет проще.
Попробуй это.
$('.form-table tbody tr').gt(1).hide();
Я предлагаю вам использовать ответ Itay. jQuery имеет отображение и скрытие для обработки элементов. В противном случае попробуйте:
$('.form-table tbody').find('tr').css('display', 'none'); //which hides all rows in table
$('.form-table tbody').find('tr:first-child').css('display', 'block'); //which will show first row in table
show
и hide
?