由于滚动冲突,JQuery在单击或模糊、停止或终止功能时进行查询

JQuery on click or on blur, stop or kill function because of scrolling conflict

本文关键字:模糊 终止 功能 查询 单击 滚动 于滚动 冲突 JQuery      更新时间:2023-09-26

我用这段代码运行平滑滚动:一切都很好!我的问题是,我有一个预订脚本,其中一个字段(输入)是选择时间
当您点击中的字段时,将显示弹出窗口,显示当天的所有马匹
您可以在这里看到工作示例,因为您可以看到计时器也使用滚动来选择一些小时。问题是定时器滚动不起平滑滚动功能。我试图用这个代码杀死滚动功能:

$( "#rtb-time" ).die( "blur", scrolling );

但这不起作用。请告知如何解决这个问题

var scrolling = function(){ 
    var $window = $(window);
    var scrollTime = 0.8;
    var scrollDistance = 170;
    $window.on("mousewheel DOMMouseScroll", function(event){
        event.preventDefault(); 
        var delta = event.originalEvent.wheelDelta/120 || -event.originalEvent.detail/3;
        var scrollTop = $window.scrollTop();
        var finalScroll = scrollTop - parseInt(delta*scrollDistance);
        TweenMax.to($window, scrollTime, {
            scrollTo : { y: finalScroll, autoKill:true },
                ease: Power1.easeOut,
                overwrite: 5                            
            });
    });
};
scrolling();

尝试在包装时间选择器的元素上使用event.stopPropagation()。

例如

$(document).on("scoll", ".picker_holder", function(event){
    event.stopPropagation();
});

它将阻止滚动事件到达您的"$窗口",并在您滚动时间选择器时阻止它滚动。