4

我正在尝试减少表中的“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 类?

编辑:这个想法来自这个SO问题(但不幸的是答案中没有源代码):Speeding Up Multiple OnMouseOver Events in IE

4

2 回答 2

8

这称为事件委托

您正在使用 jQuery,这使得通过以下方式查找<tr>事件的触发元素变得微不足道closest

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

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

于 2009-09-23T01:53:13.660 回答
0

您可以将鼠标悬停事件附加到表格,但每次您将鼠标悬停在表格的任何子元素上时,该函数都会触发。

$('#myTable').mouseover(function(e) {
  $(e.target).parents('tr');
});

这将为您提供悬停的元素的 tr 。

于 2009-09-23T01:51:05.240 回答