Javascript 如何仅在鼠标悬停侦听器未处于活动状态时执行函数

Javascript 如何仅在鼠标悬停侦听器未处于活动状态时执行函数,javascript,jquery,event-handling,listener,dom-events,Javascript,Jquery,Event Handling,Listener,Dom Events,为了避免由于页面上的滚动效果而在屏幕上出现某种闪烁效果,我希望仅当当前未发生另一个缩略图上的鼠标悬停状态时,才从缩略图的鼠标悬停激活一个功能。如何执行此操作?您可以检查缩略图元素是否有一个活动的类,该类是在成功触发mouseout事件时添加的。如果任何其他缩略图元素具有此类,则不执行任何操作,如果未找到此类,则运行mouseoutcode: $('.thumb-element').on('mouseout', function () { if ($('.thumb-element').f

为了避免由于页面上的滚动效果而在屏幕上出现某种闪烁效果,我希望仅当当前未发生另一个缩略图上的
鼠标悬停
状态时,才从缩略图的
鼠标悬停
激活一个功能。如何执行此操作?

您可以检查缩略图元素是否有一个
活动的
类,该类是在成功触发
mouseout
事件时添加的。如果任何其他缩略图元素具有此类,则不执行任何操作,如果未找到此类,则运行
mouseout
code:

$('.thumb-element').on('mouseout', function () {
    if ($('.thumb-element').filter('.active-mouseout').length == 0) {
        //there are no elements with both the `thumb-element` class and the `active-mouseout` class so you can do work here
        $(this).addClass('active-mouseout').animate({top : 'XXpx'}, 250, function () {

            //now we remove the `active-mouseout` class so another `mouseout` event can run
            $(this).removeClass('active-mouseout');
        });
    }
});
然后,您可以在必要时删除
活动mouseout
类,例如,如果它需要动画,则可以在该动画的回调中删除该类


下面是上述解决方案的一部分:

这是一个很好的解决方案;我喜欢元素本身如何包含确定是否有任何元素正在制作动画所需的逻辑。另一种方法是在动画启动时使用变量进行跟踪。没有理由使用替代方法,除非扫描某个类的元素的成本变得相关(可能在数千之前不会),这可以通过尽可能缓存
$('.thumb元素')
选择器来优化(如果它们都在
document.ready
上的DOM中,那么我将使用该事件)。