强制jquery mouseover在子级以上时不触发，仅在父级时 [英] force jquery mouseover not to trigger when over children, just parent

问题描述

我有一个<a>，里面有一个<img>，当我将鼠标悬停在有效的<a>上时，我希望发生一些事情，问题是，如果我将光标移到内部的图像上，它将再次触发.

I have an <a> with a <img> inside, and I want something to happen when hovering over the <a> which works, the problem is that if I move the cursor over the image inside, it triggers again.

有没有一种方法可以迫使它仅在超过<a>时才触发，而不是在子级(小于父级)时触发.

Is there a way to force it to trigger when over <a> only, and not the child (which is smaller than the parent).

我的js:

$('#logo a').mouseover(function() {
        $(this).addClass('active');
        $('div#header-contact').fadeIn();
    });

推荐答案

问题是鼠标悬停事件冒泡到祖先元素，因此您可以使用鼠标进入事件，不会冒泡

The problem is mouseover event bubbles to the ancestor elements, so you can use the mouseenter event which doesn't bubbles

尝试mouseenter事件

Try the mouseenter event

$('#logo a').mouseenter(function() {
    $(this).addClass('active');
    $('div#header-contact').fadeIn();
});

这篇关于强制jquery mouseover在子级以上时不触发，仅在父级时的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！