jquery - JQuery - How to select the previous table cell of a non empty table cell

Question

I am trying to select the previous table cell of a non-empty table cell.

I have the following code.

THIS WORKS (Highlight all empty cells)

$("td.brand:empty").css('background-color', 'red');

THIS WORKS (Highlight all non empty cells)

$("td.brand:not(:empty)").css('background-color', 'green');

THIS DOESN'T WORK (Highlight the previous cell of a non empty cell)

$("td.brand:not(:empty)").prev("td.brand").css('background-color', 'yellow');

All help is appreciated.

Thanks

Answer 1

如果您需要td从它们的行中抽象出 s，您可以将它们分组到一个对象中并使用索引：

var $tds = $('td.brand');
$tds.filter(":not(:empty)").each(function() {
    var i = $tds.index(this);
    if (i) // prevents wrapping to last
        $tds.eq(i-1).addClass('on');
});

http://jsfiddle.net/L3L6a/3/

Answer 2

确保在最后一行之前您的 JS 中没有任何错误，因为它可以正常工作。

您的代码是正确的，您可以在这里查看：JS Fiddle

这段代码：

$("td.brand:empty").css('background-color', 'red');
$("td.brand:not(:empty)").css('background-color', 'green');
$("td.brand:not(:empty)").prev("td.brand").css('background-color', 'yellow');

为此工作：

<table>
    <tr>
        <td class="brand">sdfsdf</td>
        <td class="brand"></td>
        <td class="brand">sdfsdfs</td>
    </tr>
    <tr>
        <td class="brand"></td>
        <td class="brand">ssdfsdf</td>
        <td class="brand"></td>
    </tr>
</table>

Answer 3

在您在评论中提供的示例中，之前没有空行td.brand，所以我猜这可能是您需要的，基于您的示例的编辑。

$("tr:has(td.brand:not(:empty))").prev().find("td.brand").css('background-color', 'yellow');

这会找到所有非空td.brand的行，然后选择前一行，然后选择该td.brand行的。

这是一个小提琴： http: //jsfiddle.net/jRCbd/1/（你的小提琴的更新）

Answer 4

$(document).ready(function(){
    $("td:not(:empty)").each(function(){
        $(this).prev().css('background-color', 'yellow');
    });
});

JS 小提琴链接