防止 Chrome 中的 mousewheel DOMMouseScroll 中的 Default() 错误

Question

我在 chrome 控制台中收到这个preventDefault()错误。我遇到了这篇博客文章，并尝试了一些像添加{ passive: false }但没有运气。我该如何解决这个问题？

我还读到建议使用return false;。但我不确定这是否是我的解决方案。所以我正在寻求你的建议。

$(document).on('wheel mousewheel DOMMouseScroll', function(event) {
    event.preventDefault();
    if(delay) return;
    delay = true;
    setTimeout(function(){delay = false},200)
        //some code
    });
})();

铬错误

[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See...

谢谢！

Answer 1

根据错误中给出的信息，转到所述错误中链接的URL，没有明显的方法可以使用jQuery解决此问题(可能是，但我不使用jQuery，所以我说你不能(...使用常规 JavaScript - 您可以在第三个参数中传递{passive:false} - 它修复了这个 Chrome "功能">

document.addEventListener('wheel', fn, {passive: false});
document.addEventListener('mousewheel', fn, {passive: false});
document.addEventListener('DOMMouseScroll', fn, {passive: false});
function fn(event) {
    event.preventDefault();
    if(delay) return;
    delay = true;
    setTimeout(function(){delay = false},200)
        //some code
}

或者，如果您希望代码更具jQuery感觉，请创建一个帮助程序函数

const addListeners = (tgt, list, fn, options) => list.split(' ').forEach(e => tgt.addEventListener(e, fn, options));

然后像使用它一样

addListeners(document, 'wheel mousewheel DOMMouseScroll', function(event) {
    event.preventDefault();
    if(delay) return;
    delay = true;
    setTimeout(function(){delay = false},200)
        //some code
    }, {passive: false}
);

如评论中所述，一些旧的(非常非常旧的(浏览器可能不喜欢这种语法({passive:true|false})

所以 - 你可能想要功能检测选项 - 来自 https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#Safely_detecting_option_support 的代码

var passiveSupported = false;
try {
  var options = {
    get passive() { // This function will be called when the browser
                    //   attempts to access the passive property.
      passiveSupported = true;
    }
  };
  window.addEventListener("test", options, options);
  window.removeEventListener("test", options, options);
} catch(err) {
  passiveSupported = false;
}

在使用之前，所以IE浏览器没有一点哭泣