jQuery在第三个之后隐藏表行

Question

我希望通过使用jQuery隐藏第三行之后的表中的所有行.这是我的方法:

<table>
    <tr id="duplicate">
        <td style="text-align:center;">1</td>
    </tr>
    <tr id="duplicate">
        <td style="text-align:center;">2</td>
    </tr>
    <tr id="duplicate">
        <td style="text-align:center;">3</td>
    </tr>
    <tr id="duplicate">
        <td style="text-align:center;">4</td>
    </tr>
    <tr id="duplicate">
        <td style="text-align:center;">5</td>
    </tr>
</table>

jQuery的:

$(document).ready(function() {
    $('#duplicate'):nth-child(n+3).hide();
    alert('123');
});

当然警报显示很好,所以它被执行但我的表没有任何结果.

Answer 1

永远不要id为每个人使用相同的tr......永远不要 Id在HTML中具有唯一的名称.您不会收到警告,但代码将无法正确处理.

使用class而不是id.

 <tr class="duplicate">
        <td style="text-align:center;">1</td>
    </tr>
    <tr class="duplicate">
        <td style="text-align:center;">2</td>
    </tr>
    <tr class="duplicate">
        <td style="text-align:center;">3</td>
    </tr>
    <tr class="duplicate">
        <td style="text-align:center;">4</td>
    </tr>
    <tr class="duplicate">
        <td style="text-align:center;">5</td>
    </tr>
...

和Javascript:

$(document).ready(function() {
    $('.duplicate:gt(2)').hide();
    alert('123');
});