Question

当我将鼠标悬停在div上时（假设它有id = div-CON），我有另一个div，定位为绝对，当我在div-CON内时弹出并跟随鼠标。当鼠标离开div-CON时，浮动div消失。

现在，有些情况下，如果浏览器缓慢或滞后，浮动div不会足够快地更新其位置，以便鼠标立即进入浮动div然后离开它。在这一瞬间，鼠标离开div-CON并再次进入，因此浮动div基本上闪烁。

关于这一点，我想知道是否有办法忽略或取消事件，以便在这种情况下，当鼠标进入浮动div时，不会在div-CON上触发mouseleave事件。

Answer 1

您可以在光标离开浮动元素时设置超时（延迟）。当它再次徘徊时，时间会消失。

请参阅 this answer 了解该概念。

var timer;
function addFollower($element, event_mouseEnter, event_mouseMove, event_mouseLeave){
    clearTimeout(timer);
    $element.mouseleave(function(){
        timer = setTimeout(event_mouseLeave, 300); //Delay of 300ms
    })
    $element.mouseenter(function(){
        clearTimeout(timer); //Clear any delay

        event_mouseEnter();
    });
    $element.mousemove(event_mouseMove)
}
addFollower($("#div-CON"),
    function(ev){
        //Mouse-enter
    },
    function(ev){
        //Mouse move
    },
    function(){
        //Mouse-leave
    }
);

Answer 2

您可以跟踪鼠标的确切位置，并检查它是否带有div-CON矩形。在鼠标离开此矩形之前，请勿触发取消操作。

有没有办法忽略鼠标事件？

2 个答案: