带有hasClass函数的jQuery父母选择器中的混淆

Question

var allChecked = $('.inboxCheckbox:checked');

if(allChecked.length > 0){
    var messageIds = new Array();
    var parentRow = null;
    allChecked.each(
        function(){
            parentRow = $(this).parents('tr'); 
            if(!(parentRow.hasClass('gradeA'))){
                parentRow.addClass('gradeA');
                increaseUnreadMessage();
            }
            parentRow = null;
            messageIds.push($(this).val());
        }
    );

}else{
    showInsMessage('<b class="redTxt">Please Select At Least One Message</b>');
}

我有多行，每行都有一个复选框...如果要选中复选框，我试图将classA添加到每行中。...如果我已经有classA，我不想调用addClass。选择多行，然后将类仅添加到一行。 这是否意味着

假设我有三行，每行都有一个复选框，当我运行$(':checked').each( $(this).parents('tr') )时我选择了每个复选框$(':checked').each( $(this).parents('tr') )是否选择了所有带有复选框的行或仅是特定的父行...然后parentRow.hasClass（'gradeA'）返回true ...我现在很困惑，如果它用复选框检查了所有行，那么有什么办法选择特定的父行......

谢谢阅读

Answer 1

看到标记会很高兴，是否还有更多的表格嵌套？

然而，

parentRow = $(this).closest('tr'); 

应该是一个更好的选择。

Answer 2

API表示.parents（）方法可搜索元素的所有祖先。 .parent（）仅在DOM树上移动单个级别。 如果您的复选框是'tr'的直接子级（不是后代），则可以尝试

parentRow = $(this).parent('tr');

Answer 3

顺便说一句，我想你可以做更多jQuerish风格：

var messageIds = [];

$('tr.youTrs').toggleClass('gradeA', function () {
    var checkbox = $(this).find('.inboxCheckbox');
    if (checkbox.is(':checked')){
        messageIds.push(checkbox.val());
        return true;
    }
    else{
        showInsMessage('<b class="redTxt">Please Select At Least One Message</b>');
        return false;
    }
});

Answer 4

您的代码应该可以工作。 我怀疑问题正在发生，因为您的函数increaseUnreadMessage()抛出错误，这导致其余的each()循环被跳过。

---

但是，要回答您的特定问题：是的，您可以选择包含选中复选框的所有行（ <td> ）。 使用jquery的：has选择器 ，如下所示：

var allCheckedRows = $('tr:has(.inboxCheckbox:checked)');

从那里，当然，您可以只使用addClass()将您的类名应用于所有这些类：

allCheckedRows.addClass('gradeA');

---

当然，您的each()循环中还有其他事情在进行，所以您可能无法完全扔掉each() 。 就像我在上面说的那样，您的代码可以工作...但是类似这样的代码可能更简洁，更易于理解。

var messageIds = new Array();

var allCheckedRows = $('tr:has(.inboxCheckbox:checked)');
allCheckedRows.addClass('gradeA');
allCheckedRows.find('.inboxCheckbox').each( function() {
   var cb = $(this);
   increaseUnreadMessage();
   messageIds.push( cb.val() );
});

if( messageIds.length === 0 ) {
   showInsMessage('<b class="redTxt">Please Select At Least One Message</b>');
}