无法触发锚悬停在img mouseenter上

Question

我有这个HTML：

<li>
    <a href="#"><img src="myimage.jpg"></a>
    <div>
        <h4><a href="#">my h4 link</a></h4>
        <p>some text</p>
    </div>
</li>

当鼠标悬停在图像上方时，我想触发悬停在<a>内的<h4>上。

我尝试了以下操作，但它无法正常工作：

$('li img').hover(function() {
    $(this).parent().parent().find('h4 a').trigger('mouseenter');
});

这不起作用，但如果我通过css方法为其分配颜色，例如：

$('li img').hover(function() {
    $(this).parent().parent().find('h4 a').css('color', 'red');
});

为什么悬停不起作用？如何使其起作用？

Answer 1

通过javascript触发事件将运行相关的javascript事件，而不是默认行为！因此，除非您为该元素定义了mouseenter事件，否则不会发生任何事情。