Question

我的悬停功能有问题。

HTML

<div id="test" style="border:1px solid #ff0000; position:absolute; right:0px; bottom:0px; height:20px; width:100px;" ></div>

JQUERY

$('#test').hover( function ()
    {
        $('#outp').append('enter <br />');  
    }, function ()
    {
        $('#outp').append('leave <br />');   
    });

演示
http://jsfiddle.net/ky5fW/8/

当您在底部输入（或离开）div test时，jquery无法识别它。但为什么呢？

希望有人可以帮助我提前谢谢！
彼得

修改
奇怪，它适用于实时功能，但为什么呢？
http://jsfiddle.net/ky5fW/11/

 $('#test').live('hover', function (event)
   {
       if (event.type == 'mouseenter')
       {
          $('#outp').append('enter 2 <br />');
       }
       if (event.type == 'mouseleave')
       {
          $('#outp').append('leave 2 <br />');
       } });

Answer 1

如果光标通过窗口的chrome（底部或右侧）离开元素，则不会触发鼠标离开事件。这很正常。

更新

奇怪，它适用于实时功能，但为什么呢？

可能是因为live()没有直接附加事件，而是捕获冒充DOM的事件，并检查event.target以查看最初触发事件的元素。

Answer 2

唯一的解决方法是将元素放置在窗口的范围内，以便在使用悬停事件触及元素之前捕获鼠标移动。

#test {
    border: 1px solid #ff0000; 
    position: absolute; 
    right: 2px; 
    bottom: 2px; 
    height: 20px; 
    width: 100px;
}

...

<div id="test"></div>

Jquery - Hover没有启动（底部/右侧问题）

2 个答案:

更新