如何仅将类添加到父行而不是全部答案

【问题标题】：How to add class only to parent row not to all如何仅将类添加到父行而不是全部
【发布时间】：2012-01-31 00:28:31
【问题描述】：

使用此功能。但它会将 row_selected 类添加到所有行。我怎样才能将它添加到父行？

$('.checkbox').click( function() {
    if ( $("#list tr").hasClass('row_selected') )
        $("#list tr").removeClass('row_selected');
    else
        $("#list tr").addClass('row_selected');
} );

【问题讨论】：

parent row 是什么意思？父表格单元格中有表格吗？
@Cheery CHECKBOX

标签： javascript jquery function class html-table

【解决方案1】：

您可以使用.closest() method 查找与特定选择器匹配的最近的父（或祖父母/祖先）元素。所以试试这个：

$('.checkbox').click( function() {
   $(this).closest("tr").toggleClass("row_selected");
});

请注意，.toggleClass() method 会为您处理 if/else，但如果您真的想手动编码：

$('.checkbox').click( function() {
    // store the reference to the containing tr in a variable instead of
    // reselecting it
    var $tr = $(this).closest("tr");
    if ($tr.hasClass('row_selected') )
        $tr.removeClass('row_selected');
    else
        $tr.addClass('row_selected');
});

请注意，无论哪种方式，在 jQuery 事件处理程序中，this 是触发事件的元素，因此您可以通过使用 $(this) 获取 jQuery 对象来操作它或找到它的父/兄弟/任何东西。

【讨论】：