Question

table#id_table_comments tr td {
    /*background: #fff;*/
    background: #f5f5f5;
    padding: 6px;
    text-align: left;
    vertical-align: top;
    border-bottom:1px solid #ddd;
}
table#id_table_comments tr:nth-child(2n) td {
    /*background: #f5f5f5;*/
    background: #fff;
}
.classTableRow{
    background-color: #9999CC;
    border: 1px solid gray; 
}



$(document).ready(function(){
    $("td").mouseover(function(){
        $(this).addClass('classTableRow');
    })

    $("td").mouseout(function(){
        $(this).removeClass('classTableRow');
    })
});

但是jQuery不能用于第n行（甚至是行）。

我该怎么办？

Answer 1

table#id_table_comments tr:nth-child(2n) td比.classTableRow更具体，因此其背景胜出将!important添加到.classTableRow后台以强制它覆盖其他选择器。

此外，您应该使用:hover而不是使用jQuery来添加类。

Answer 2

如果我理解正确，您希望在表格中的特定TR上选择特定的TD。

如果是这种情况，请收集行索引并向其添加一个（如果您不想计算标题）。然后选择特定的细胞很容易。

var row = $(this).closest('tr').index() + 1; 
thisRow = "table tr:nth-child(" + row + ")";
thisCell = thisRow + " td:nth-child(N)";

jQuery帮助：如何选择tr td n行？

2 个答案: