jQuery .hasClass, .closest() and $(this)

Question

如果子td > p有某个类，我将尝试突出显示表的父tr。我有以下内容：

$(document).ready(function(){
    var $target = $('.flag-wrapper p').closest("tr");
    var $element = $('.flag-wrapper p').hasClass("selector-on");
    if ( $element ) {
        $target.addClass("marked-row");
    } else {
        // whatsoever
    }
});

http://jsfiddle.net/cZJca/1/

现在我的问题是，我不能只针对当前tr。我试过使用$（this），但据我所知，它在if语句中不起作用。

如有任何关于我应该如何进行这项工作的见解，我们将不胜感激。此外，我想使用.click（）事件会更容易，但我必须在页面加载时检查这个.hasClass（），而不是用户操作。

Answer 1

只需使用：

 $('.flag-wrapper p.selector-on').closest('tr').addClass("marked-row");

这将查找.flag-wrapper中具有类.selector-on的所有p元素。然后，它获得每个匹配中最接近的tr，并添加.marked-row类。

它在这里工作：http://jsfiddle.net/cZJca/6/

Answer 2

对每一个循环并分别处理。

$('.flag-wrapper p').each(function(){
    var $this = $(this);
    var $target = $this.closest("tr");
    if($this.hasClass("selector-on")){
        $target.addClass("marked-row");
    } else {
        // whatsoever
    }
});

Answer 3

您只需要执行

$('tr:has(.flag-wrapper p.selector-on)').addClass('marked-row');

小提琴

或

$('tr').has('.flag-wrapper p.selector-on').addClass('marked-row');

FIDDLE

Answer 4

您可以在段落上循环以单独针对它们：

$(document).ready(function(){
    $('.flag-wrapper p').each(function() {
        var $curElement = $(this);
        if ($curElement).hasClass("selector-on")) {
            $curElement.closest("tr").addClass("marked-row");
        } else {
           // whatsoever
        }
    });
});

Answer 5

$('.flag-wrapper p.selector-on').closest('tr').addClass('marked-row');