javascript - debounce 功能意味着鼠标滚轮上的 e.preventDefault 不再起作用

Question

我正在使用鼠标滚轮改变页面的背景。我只想在 1000 毫秒内触发一次鼠标滚轮事件，因此我使用了去抖动功能。

在我添加去抖动功能并使用e.preventDefault()它之前，它会阻止滚动工作。但是，现在我已经添加了 debounce 功能，这不再起作用，用户可以再次滚动页面。

请看下面的代码。

$(document).ready(function() {
    $(document).on('mousewheel DOMMouseScroll',debounce(function(e){
        e.preventDefault();
        //code to change the background image
    }, 1000))
});

function debounce(fn, delay) {
  var timer = null;
  return function () {
    var context = this, args = arguments;
    clearTimeout(timer);
    timer = setTimeout(function () {
      fn.apply(context, args);
    }, delay);
  };

Answer 1

然后像这样构建它：

$(document).ready(function() {
    var changeBackground = debounce(function(e){
        //code to change the background image
    }, 1000)
    $(document).on('mousewheel DOMMouseScroll',debounce(function(e){
        e.preventDefault();
        changeBackground(e);
    })
});