Question

我对一段代码有一些问题，我在链接上使用了一种工具提示，但当链接中包含子元素时，它会快速闪烁（当我将鼠标悬停在子元素上时）。 / p>

基本的jQuery代码（显示提示的部分）（剥离版本，不能使用悬停事件！）

    $('.aaa').bind('mouseover mouseout',function(e) {
        if(e.type == 'mouseover'){
           $('.tip').show() 
        }else{
           $('.tip').hide() 
        } 
    });

这是有效的

    <a href="#" class="aaa"></a>

这不起作用（好）

   <a href="#" class="aaa">
      <img src="images/icon.png"/>
      <span>text</span>
   </a>

Answer 1

使用mouseenter和mouseleave而不是mouseover mouseout。

为每个子元素触发一次鼠标悬停/移出。输入/离开是你想要/期望的。 jQuery已经在所有浏览器中对这些进行了规范化。

编辑：这是一个参考页面：http://api.jquery.com/mouseenter/

Answer 2

您应该使用hover()方法

var $tip = $('.tip');

$('.aaa').hover(
    function() {
        $tip.show();
    },
    function() {
        $tip.hide();
    }
);

jQuery mouseover mouseout问题

2 个答案: