jquery - 滚动时防止 mouseenter 功能

Question

我试图防止当用户在 jQuery 中滚动但无法弄清楚时发生 mouseenter 函数，有什么建议吗？

代码：

$(".li").mouseenter(function(){
$(this).children(".work_name").toggleClass("open", 400);

$('.li').mouseleave(function(){
  $(this).children(".work_name").removeClass("open", 400);
});

});

Answer 1

您可以按如下方式实现它：

window.isScrolling = false;
$(window).scroll(function() {
    window.isScrolling = true;
    clearTimeout($.data(this, "scrollTimer"));
    $.data(this, "scrollTimer", setTimeout(function() {
        // If the window didn't scroll for 250ms
        window.isScrolling = false;
    }, 250));
});

然后像这样更改您的代码：

$(".li").mouseenter(function(){

// Prevent executing when the user is scrolling
if (window.isScrolling) return;

$(this).children(".work_name").toggleClass("open", 400);

$('.li').mouseleave(function(){
  $(this).children(".work_name").removeClass("open", 400);
});

});