0

我正在尝试选择表格的特定行以使用 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>

我要做的是首先选择表格并使用 display: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');

它需要一些润色,但我主要关心的是查找部分。有任何想法吗?

编辑:我忘了写我有几张同一个班级的桌子,我需要选择正确的一张。根据标签中的for属性。

4

5 回答 5

1

You don't need the find() -- to hide all you can just do:

$('.form-table tbody tr').css('display', 'none');

Or

$('.form-table tbody tr').hide();

To show the first you can use:

$('.form-table tbody tr').first().show();

EDIT

And, to show a given row you can do:

$('.form-table tbody tr td input[name="aim"]').parent().parent().show();

Which is a little clunky, and prone to breaking, but it should work -- it would be better if you could give ids to the tr elements.

EDIT 2 In response to your edit ...

You can hide a table with a given element (id = aim) like this:

$('.form-table tbody tr td input#aim').parent().parent().parent().children().hide();

and then show a single row (id = aim) like this:

$('.form-table tbody tr td input#aim').parent().parent().show();
于 2013-09-22T07:17:26.700 回答
1

To hide elements you can use the .hide() function.

And you were misusing the .find() function. It's advisable that you read its documentation.

The following code selects all the table rows and filters out the first one, then hide the remaining rows (second and beyond).

$('.form-table > tbody > tr').not(':first-child').hide();
于 2013-09-22T07:17:40.807 回答
0

You can hide all of the rows like this:

$('.form-table tbody tr').hide();

if your email field will be the first row, you can show it like this:

$('.form-table tbody tr').first().show();

http://jsfiddle.net/BLeMG/

If you want a specific table, you should just give your tables ids, and use the id selector, it's gonna be easier for you that way.

于 2013-09-22T07:17:46.433 回答
0

Try this.

$('.form-table tbody tr').gt(1).hide();
于 2013-09-22T07:19:14.923 回答
0

我会建议你使用 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
于 2013-09-22T07:20:25.817 回答