javascript - 如何从表中隐藏所有 tr 除了单击一个

Question

我想隐藏所有<tr>除了我点击的表格。

<table>
    <tr>
        <td>ABC</td>
        <td>DEF</td>
        <td><i class="delete">delete </i></td>
    </tr>
    <tr>
        <td>ABC</td>
        <td>DEF</td>
        <td><i class="delete">delete </i></td>
    </tr>
</table>

点击删除按钮隐藏除当前行以外的所有行。

J查询代码:-

$(document).ready(function () {
    $('table tbody tr').siblings().not($(this)).hide();
});

请给我建议。

Answer 1

按如下方式使用siblings:

查看代码中的内联注释:

// Bind click event on `tr` inside `table`
$('table').on('click', 'tr', function () {
    // Show current `tr` and hide others
    $(this).siblings().hide();
});

演示:http://jsfiddle.net/tusharj/LL0c2efg/