0

我检测页面上的滚动并在使用向上或向下滚动时执行一些代码。问题是代码非常快速地多次触发。我需要代码一旦执行就不能再次执行 1 秒。

理想情况下，任何执行都将被禁用 1 秒。所以如果 //do something 刚刚触发，那么它在 1 秒内不能再次触发，也不能 //do something else

注意 - 我知道这不是完全可靠的跨浏览器，但这在那一刻很好。它也不需要为触摸屏滚动工作。

$(document).ready(function(){
    $('body').bind('mousewheel', function(e){
        if(e.originalEvent.wheelDelta /120 > 0) {
            //do something
        }
        else{
            //do something else 
        }
    });
});

我试过使用超时功能，但它似乎等待然后触发多次，而不是一次： 

setTimeout(function() {
    //do something 
    event.stopPropagation();
}, 1000);
4

4 回答 4

0

您设置了一个超时，然后在每次滚动时清除该超时，这样超时仅在用户停止滚动时执行，而不是每次都执行：

$(document).ready(function(){
    $('body, html').on('scroll', function(e){
        clearTimeout( $(this).data('timer') );
        $(this).data('timer', 
            setTimeout(function() {
                if( $(this).scrollTop() > 0) {

                }else{
                    //do something else 
                }
            }, 1000)
        );
    });
});
于 2013-08-08T11:51:41.160 回答
0

你应该试试Underscore 的 debounce 方法。

于 2013-08-08T11:51:45.320 回答
0

一种方法是在您第一次调用它后立即取消绑定该事件，然后使用 setTimeout 重新绑定它

于 2013-08-08T11:51:14.300 回答
0

看看去抖动/油门。有一个流行的jQuery 插件，它是由 Ben Alman 编写的，它提供了这种功能。另请参见下划线。

去抖还是油门？从文档：

好吧，简单地说：虽然节流将函数的执行限制为每延迟毫秒不超过一次，但去抖动保证函数只会执行一次（给定指定的阈值）。

于 2013-08-08T11:51:15.313 回答