Jquery悬停，突出显示除最后一个单元格之外的表格行答案

【问题标题】：Jquery hover, highlight table row except last cellJquery悬停，突出显示除最后一个单元格之外的表格行
【发布时间】：2012-03-29 09:28:54
【问题描述】：

我想将此 css 行为转换为 jquery hover 语句（因为 IE7/8 不支持 css3）。基本上，当悬停在一行上时，我希望整行突出显示，除了最后一个单元格。

#mysearchtable tr:hover td:not(:last-child)
{
  background-color: #444444;
}

我试过用这个：

$("#mysearchtable tr td:not(:last-child)").hover(
 function () { $(this).addClass('hoverclass') }, 
 function () { $(this).removeClass('hoverclass') });

问题在于 $(this) 只返回悬停在上面的实际单元格。我可以尝试使用 $(this).parent() 但这会给我整行。我想要的是突出显示整行，除了最后一个单元格。

有人知道解决办法吗？

干杯。

【问题讨论】：

$(this).siblings().find('td:not(:last-child)').add/removeClass() ？没有检查，但没有理由不工作。
您的 CSS 选择器错误。使用#mysearchtable tr td:not(:last-child):hover 使用原始选择器说“突出显示行，但不突出显示最后一个单元格”，这是没有意义的，因为您突出显示的是容器（行）而不是容器中的单个单元格。
他的选择器不是这么说的。它是“当行悬停时，突出显示单元格，但不是最后一个。”你的是，“当一个不是最后一个的单元格悬停时”。

标签： javascript jquery hover highlight

【解决方案1】：

未经测试，但尝试：

$("#mysearchtable tr").hover(
    function () { $(this).find("td:not(:last-child)").addClass('hoverclass') }, 
    function () { $(this).find("td:not(:last-child)").removeClass('hoverclass') }
);

【讨论】：

【解决方案2】：

在这里你可以使用这种方式。 Jsfiddle demo

$("table td").not('td:last').hover(function() {
    $(this).css('background-color','red');
});

【讨论】：