javascript - 如何在jQuery中隐藏除一行之外的所有行？

Question

如何使用jQuery隐藏除当前（单击的行）之外的所有行？

当我单击除当前一行之外的特定行时，我想隐藏所有行。

<table>
@foreach (var item in Model)
    {
        idValue++;

        <tr class="tableRow" id="@idValue">
            <td class="master"  id="@item.Batch_Seq">
                <a href= "#" >@(item.Batch_Name)></a>
            </td>
            <td>
                @(item.Present)
            </td>
            <td>
                @(item.Absent)
            </td>
            <td>
                @(item.HalfDay)
            </td>
            <td>
                @(item.Batch_count)
            </td>
        </tr>

    }
</table>

我试过这样

$('.tableRow').hide();
$(this).closest('tr:not(.tableRow)').hide();

有人可以帮我吗？

Answer 1

你似乎想要这个：

$('.tableRow').click(function(){
     $('.tableRow').hide(); // hide all rows
     $(this).show(); // show the clicked one
});

请注意，用户不会注意到该行被隐藏然后显示：在事件处理程序结束之前不会重新绘制屏幕。

Answer 2

使用.not()选择所有具有类tableRow的元素，除了被点击的元素( this)

$('tr.tableRow').click(function() {
    $('tr.tableRow').not(this).hide();
});

Answer 3

您可以使用 not()隐藏所有不是“this”的内容：

 $('table tr.tableRow').click(function(){
        $('table tr').not(this).hide(); // hide everything that isn't "this"
    });

或者您可以使用.siblings()隐藏单击行的兄弟姐妹

$('table tr').click(function(){
    $(this).siblings().hide(); // hide the siblings of the clicked row
});

工作示例：http: //jsfiddle.net/ouadie/U7eUR/