javascript - 滚动计数器 - _.debouce 修复

Question

我的问题

我创建了一个计数器，每次用户向上或向下滚动时都会升高或降低一个。问题是我的柜台

$('html').on('mousewheel', function (e) {
    var delta = e.originalEvent.wheelDelta;

    if (delta < 0) {
        --count;
        transitionScreen(count);
        //$('h1').text ('You scrolled down');

    } else if (delta > 0 && count < 0) {
        ++count;
        transitionScreen(count);
        //$('h1').text ('You scrolled up');
    }
});

通过滚动多次递增。

解决方案

所以有人建议使用 underscore.js 的debounce 函数来防止我的计数器函数在给定的时间内被执行多次。

问题是我不确切知道如何实施解决方案：

有人可以帮我使用 _.debounce 这个功能吗？我正在查看示例，但不完全了解如何在此处使用它。我是 javascript 的新手并且很快就学会了，所以任何帮助都将不胜感激。

文档剪辑

Debounce 在文档中是这样使用的：

debounce_.debounce(function, wait, [immediate]) 

这是一个用法示例：

var lazyLayout = _.debounce(calculateLayout, 300);
$(window).resize(lazyLayout);

谢谢！

Answer 1

$('html').on('mousewheel', _.debounce(function(e){
    var delta = e.originalEvent.wheelDelta;

    if (delta < 0) {
        --count;
        transitionScreen(count);
        //$('h1').text ('You scrolled down');

    } else if (delta > 0 && count < 0) {
        ++count;
        transitionScreen(count);
        //$('h1').text ('You scrolled up');
    }
}, 250));

而已。就像它显示的那样，不是传递你的函数，而是传递函数的结果_.debounce。