jquery - 在不允许事件传播的情况下手动触发 mouseover 事件

Question

如何使用 jQuery 仅针对特定元素触发鼠标悬停事件，而不允许事件传播到父控件。

我知道如何触发事件：$('selector').trigger('mouseover');

例如，我有一个imageinside tr。我有他们两个的悬停事件处理程序。我想为图像手动触发悬停事件。

有人有想法吗？

Answer 1

我在这里的示例中找到了答案。这是解决我的问题的代码：

var event = jQuery.Event('<event_name>');
event.stopPropagation();
$('<selector>').trigger(event);

Answer 2

您可以将鼠标悬停附加为普通事件侦听器，然后执行类似的操作。

$("selector").on('mouseover', function(event){
  event.stopPropagation();
  // do something
}); 

这将阻止事件冒泡到容器元素。然后，您可以像往常一样调用触发器

$('selector').trigger('mouseover');

Answer 3

使用mouseenter或event.stopPropagation()喜欢

$("img").on('mouseover', function(e){
    e.stopPropagation();
    // do something
});

或者

$("img").on('mouseenter', function(e){
    // do something
});

阅读mouseenter()和mouseover()