Preventing the default for a passive default

Question

I'm trying to prevent the default scrolling behavior.

Initially I tried this, from these answers

$(window).on('mousewheel DOMMouseScroll', wheel);

function wheel(e) {
    e.preventDefault()
}

This resulted in this error: [Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See <URL>

Sure. I found these questions and added their solution.

$(window).on('mousewheel DOMMouseScroll', wheel, {passive:false});

Now however I am getting the following error:

Uncaught TypeError: ((p.event.special[l.origType] || {}).handle || l.handler).apply is not a function at dispatch (0dfbbab736b8.js:formatted:1850) at h (0dfbbab736b8.js:formatted:1685)

The only related question I could find simply told me to remove the {passive:false}, which means I'm back at my original problem.

What am I doing wrong? How can I prevent the default behavior here?

Answer 1

Looks like an obscure jQuery error - why not just ditch the jQuery and use the built-in event instead?

window.addEventListener('wheel', e => e.preventDefault(), { passive: false });

body {
  height: 2000px;
}