使用CSS和jQuery检测所选行的前一行

Question

我有一张桌子：

<table>
    <thead>
        <tr>
            <th></th>
            ...
        <tr>
        ...
    </thead>
    <tbody>
        <tr>
            <td></td>
            ...
        </tr>
        <tr>
            <td></td>
            ...
        </tr>
        <tr> I click here but I want that class refers to the previous row
            <td></td>
            ...
        </tr>
    </tbody>
</table>

我使用jQuery为点击的行添加一个类。我希望该类引用所单击的一行的前一行。

我想我应该使用nth-child ..？

Answer 1

您可以使用jQuery .prev()功能来实现此目的。

您可以像以下一样使用它：

<强> HTML

<table border="1">
    <thead>
        <tr>
            <th>Head</th>
        <tr>
    </thead>
    <tbody>
        <tr>
            <td>Data</td>
        </tr>
        <tr>
            <td>Data</td>
        </tr>
        <tr>
            <td> I click here but I want that class refers to the previous row</td>
        </tr>
    </tbody>
</table>

<强>的jQuery

$(document).ready(function(){
    $('tr').click(function(){
        $(this).prev().css({"background-color":"pink"});
    });
});

JsFiddle

希望这有帮助！