Javascript 如何将时间间隔内触发的鼠标滚轮滚动事件数减少为单个事件

目前在我的网站上，我有一个鼠标滚轮功能，可以滚动用户在页面上设置位置。但是，当用户滚动速度稍快且不将滚动限制为单个鼠标滚轮滚动单元时，此功能会触发多次。如何在一秒钟的特定时间间隔内获取所有鼠标滚轮滚动事件，并使其触发我的函数一次？

此jQuery代码允许您以毫秒为单位设置间隔

var区间=2000；
var last=0；
$（文档）。滚动（函数（）{
var now=new Date（）.getTime（）；
如果（上次+间隔<现在）{
最后=现在；
//做事
}
});可以在事件处理程序上使用提供去盎司功能，但jQuery不提供。下面是一个简单的示例：

function debounce(func, wait, immediate) {
    var timeout;
    return function() {
        var context = this, args = arguments;
        var later = function() {
            timeout = null;
            if (!immediate) func.apply(context, args);
        };
        var callNow = immediate && !timeout;
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
        if (callNow) func.apply(context, args);
    };
};

var delay = 1000; // 1s

var handlerFunction = debounce(function (e) {
  console.log(1);
}, delay);

$(document).on('scroll', handlerFunction);

一旦你有了这个，你可以这样使用它：

function debounce(func, wait, immediate) {
    var timeout;
    return function() {
        var context = this, args = arguments;
        var later = function() {
            timeout = null;
            if (!immediate) func.apply(context, args);
        };
        var callNow = immediate && !timeout;
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
        if (callNow) func.apply(context, args);
    };
};

var delay = 1000; // 1s

var handlerFunction = debounce(function (e) {
  console.log(1);
}, delay);

$(document).on('scroll', handlerFunction);

而您的处理程序将仅在上次调用处理程序后1000毫秒执行

给你玩