jQuery:当鼠标不悬停在元素 X 或 Y 上时，隐藏 Y？

Question

我有一些图像并排排列，每当我将鼠标悬停在其中一张图像上时，就会出现该图像的工具提示(包含一些信息等)。工具提示信息是通过 ajax 加载的，但这无关紧要。

问题是，当我将鼠标悬停在其中一张图像时，工具提示就会加载，而每当我将鼠标悬停在其中一张图像之外时，工具提示就会消失。所以我无法将鼠标悬停在工具提示上，而我需要这样做。

所以我想到了记录我在对象中悬停的每个元素的解决方案。像这样:

$('*').mouseenter(function() {
    currently_hovering = $(this);
});

然后当我将鼠标悬停在图像之外时，检查鼠标是否悬停在工具提示上，如果是，则不执行任何操作，如果不是，则隐藏工具提示。听起来不错，对吧？但由于某种原因，每当我将鼠标悬停在工具提示上时，它都会拒绝记录。它仍然表现得好像我在图像上一样(但是当我在图像中移动鼠标时，工具提示会闪烁得很厉害)。

我假设它不会记录工具提示，因为它是绝对定位的？它位于图像上方(这样我就可以将鼠标移动到它而不隐藏它)。我尝试过使用 mouseenter/mouseover 和悬停，结果都相同。

有什么解决办法吗？

Answer 1

部分问题可能是您使用 ajax 加载信息。

您需要对正常页面加载后添加到页面的数据使用 live() 函数，以便脚本能够处理所述数据。

有点像这样:

    $('.day').live('mouseover mouseout',function(e) {
        if (e.type === 'mouseover') {
            $(this).addClass('day-hover');
        } else {
            $(this).removeClass('day-hover');
        }
    });