5

我想根据表数据ID从我的表中隐藏一些表行,我只找到了基于表数据值隐藏表行的方法,但这(在我的情况下)不是解决方案。

例如,假设这是我的表:

<table id='table1' border="1">
<tr id='hideme'>
<td id='letmehide'>row 1, cell 1</td>
<td id='letmehide'>row 1, cell 2</td>
</tr>
<tr id='donthideme'>
<td id='dontletmehide'>row 2, cell 1</td>
<td id='dontletmehide'>row 2, cell 2</td>
</tr>
</table>

我的 javascript/JQuery 应该是什么样的?小提琴:http: //jsfiddle.net/twyqS/

4

7 回答 7

8

考虑到 id 在您的页面上必须是唯一的,因此我建议您使用 css 类而不是 id

HTML

<table id='table1' border="1">
<tr class='hideme'>
<td class='letmehide'>row 1, cell 1</td>
<td class='letmehide'>row 1, cell 2</td>
</tr>
<tr class='donthideme'>
<td class='dontletmehide'>row 2, cell 1</td>
<td class='dontletmehide'>row 2, cell 2</td>
</tr>
</table>

JS

$('#table1 .hideme').hide();

这将允许您在必要时隐藏几行。

于 2013-08-14T13:40:38.337 回答
2

首先是您使用 jQuery,使用它来附加您的事件处理程序。它会产生更多语义化的 HTML,并且可以更好地分离关注点。

关于您的问题,您应该使用:first选择器来获取第一个tr元素,然后是hide()函数:

$('#table1 tr:first').hide();

或者,您可以使用idof ,tr因为它旨在是唯一的:

$('#hideme').hide();

我建议您熟悉一下 jQuery API,特别是可用的选择器

于 2013-08-14T13:42:15.240 回答
1

试试这个:

$('#table1 tr[id="hideme"]').hide();//in table1 hide tr that are with attribute id="hideme"
于 2013-08-14T13:43:08.433 回答
1

元素的 ID 应该是唯一的,所以在你的元素中使用类属性而不是 ID

尝试

<table id='table1' border="1">
    <tr class='hideme'>
        <td class='letmehide'>row 1, cell 1</td>
        <td class='letmehide'>row 1, cell 2</td>
    </tr>
    <tr class='donthideme'>
        <td class='dontletmehide'>row 2, cell 1</td>
        <td class='dontletmehide'>row 2, cell 2</td>
    </tr>
</table>

然后

$('#table1 tr:has(td.letmehide)').hide()

演示:小提琴

于 2013-08-14T13:43:18.390 回答
1

$("#letmehide").parent().hide();

于 2013-08-14T13:43:34.817 回答
1

试试这个...

$(document).ready(function(){
    $('button').on('click', function(){
        $('#table1 tr:first').hide();
    });
});

看到这个...

演示

于 2013-08-14T13:46:58.620 回答
-1

对于其他想要对多个tr使用相同id的人 试试这个:

$(this).closest("tr").hide();
于 2020-03-21T22:55:44.503 回答