0

我刚刚开始在 jQuery 中进行事件冒泡,所以我的理解非常有限。我需要处理父容器级别的 html 表(网格)行/单元格上发生的所有事件。示例: 1.当用户单击一行时,我不想将 click 事件绑定到每个我将其绑定到 parent 。2. 当用户将鼠标悬停在单元格上时,我想显示工具提示,即需要将标题属性设置为单元格的文本元素。我也需要冒泡这个事件。

我能够解决我的要求的第一部分。这是第 1 部分的代码(下面添加了 jsFiddle):

$('#grid').click(function(evt) {
    var row = $(evt.target).parent('tr'); // Get the parent row
    var cell= $(evt.target); //Get the cell
    alert('Row data: ' + row.text());
    alert('Cell data: ' + cell.text());
});

我认为实现悬停也很简单。但我无法捕获单个单元格的值。这是我在小提琴jsFiddle 中的示例代码:在单元格悬停时冒泡事件的示例代码

另外,我注意到我在悬停时看到两次警报。我猜它是为单元格引发事件一次,然后为行/表引发事件。没有把握?

4

1 回答 1

3

您可以$.on像下面这样实现这一点。从 jQuery 1.7 开始,所有对.live(), .bind(), '.delegate()' 的调用都在后台使用.on()。并且.on仅在该元素上绑定事件#grid并拦截该元素上的事件,然后检查目标是否匹配第二个选择器。如果是,则执行该函数。

$('#grid').on('mouseenter','td', function(){
       console.log($(this).text());
   });​

工作小提琴

于 2012-06-14T18:55:36.210 回答