jQuery事件冒泡:获取原始元素鼠标悬停(用于表行突出显示)

Question

我正在尝试减少我的表中的'onmouseover'事件监听器(我在其中突出显示悬停时的行).我想通过将事件监听器附加到整个表而不是每个<tr>(这就是我现在的方式)来做到这一点.原因是IE反应非常缓慢,我发现的唯一答案是减少事件监听器的数量.

示例代码:

<table id="myTable">
   <tr>
     <td>Somedata</td>
   </tr>
   <tr>
     <td>Somedata 2</td>
   </tr>
   <tr>
     <td>Somedata 3</td>
   </tr>       
</table>

在这种情况下,如果我将鼠标悬停在第二个<tr>上,我就会明白"onmouseover"事件会从tr冒泡到表中.

我怎么能在我的jQuery $('#myTable').mouseover事件中发现tr被徘徊并改变它的css类？

编辑:这个想法来自这个问题(但遗憾的是答案中没有源代码):在IE中加速多个OnMouseOver事件

Answer 1

它被称为事件委托.

您正在使用jQuery,通过以下方式可以轻松找到<tr>事件的触发元素closest:

$('#myTable').mouseover(function(event) {
    var tr = $(event.target).closest('tr');
    // do something with the <tr> element...
})

closest实际上是为了支持这样的事件委托而编写的.这是live()内部使用的.