获取 MouseLeave 事件后鼠标悬停的第一个元素

Posted 2023-05-09

【中文标题】获取 MouseLeave 事件后鼠标悬停的第一个元素

【英文标题】：Get the first element that the mouse hovered after a MouseLeave event

【发布时间】：2012-05-09 02:49:28

【问题描述】：

使用 jQuery/javascript，我如何检查在 MouseLeave 事件之后鼠标悬停的第一个元素是什么？

基本上，我想从元素数组中检查鼠标是否在这些元素上滚动。

我正在尝试使用event.relatedTarget。

有什么帮助吗？

【参考方案1】：

鼠标事件上存在relatedTarget 属性

MouseEvent.relatedTarget 只读属性是鼠标事件的次要目标，如果有的话

对于mouseleave，它指向输入的元素。

所以你可以这样做

$('element').mouseleave(function(event)
    // assuming that allowedList holds the array of allowed elements
    if ( allowedList.indexOf( event.relatedTarget ) > -1 )
        // found
     else 
        // not found
    
);

http://jsfiddle.net/gaby/V4pJb/ 上的演示

【讨论】：

这正是我想要达到的目标。

【参考方案2】：

使用 jQuery，您可以这样做：

​$("#foo").mouse​​​leave(function(e) 
    var element = $(e.target);
)​;​

这是一个工作示例。您可以将鼠标悬停在文本“Hello”上，鼠标移出时，它会告诉您它要离开哪个元素。 http://jsfiddle.net/k7Gfv/

如果 mouseenter（或 hover）与 mouseleave 不同，那么您需要使用变量进行跟踪。在 mouseenter（或悬停）上，设置一个将存储该元素的变量。在 mouseleave 时，您可以引用该变量（只需记住在下次触发 mouseenter 时清除或重置该值）。

【参考方案3】：

不确定您在寻找什么，但可能是这样的：

var elements = $("#a1, #a2");

$("#a3").on('mouseleave', nextElm);

function nextElm() 
    $('div').on('mouseenter', thisIsIt);
    $("#r").html('Now hover another element ?');   


function thisIsIt(e) 
    if ($.inArray(e.target, elements)!=-1)
        $("#r").html('yes');
    else
        $("#r").html('no');            
    
    $("#a3").off('mouseleave', nextElm);
    $('div').off('mouseenter', thisIsIt);

​

FIDDLE

【参考方案4】：

你可以做这样的事情。 Here's a fiddle

var hovered = false;;
$('div').mouseleave(function(e) 
    hovered = true;
);
$('div').hover(function(ev) 
        if (hovered) 
            alert(ev.target);
            hovered = false;
        
);
​