JQuery鼠标事件:如果元素移动，如何触发回调？

Question

我有以下消息来源：

$("body").on('mouseenter', '.tile-2', function () {
  $(".tile-explanation-embarklogo").fadeIn(400)
}).on('mouseleave', '.tile-2', function () {
  $(".tile-explanation-embarklogo").fadeOut("200")
});

当光标悬停在带有类tile-2的元素上时，就会显示隐藏的div。因此，当光标悬停在元素上时，我再次隐藏div。

问题是，有时tile-2元素会自行移动，甚至消失(用户输入可以移动tile-2元素)。这是有问题的，因为游标从来不离开元素本身，而且我无法隐藏div。它永远存在，没有能力移除它。

我怎样才能打电话给：

$(".tile-explanation-embarklogo").fadeOut("200")

当瓷砖本身离开光标的时候？

Answer 1

我不知道你为什么在身体标签上有你的听众，但是试试这个：

$('.tile-2').on('mouseenter', function() 
{
    $('.tile-explanation-embarklogo').fadeIn(400);
});

$('.tile-2').on('mouseleave', function() 
{
    $('.tile-explanation-embarklogo').fadeOut(200);
});

Answer 2

您也可以尝试悬停事件，让jquery为您完成以下工作：

$('.tile-2').hover(function () {
    $(".tile-explanation-embarklogo").fadeIn(400)
}, function () {
    $(".tile-explanation-embarklogo").fadeOut("200")
});