🔰capturing phase
handlers registered on container elements have the oppertunity to intercept events before they are delivered to their actual target.
// capturing handler, same as {capture: true}
container.addEventListener("click", capturingHandler, true);
// ⭐️ prevent touch screen default actions.
container.addEventListener("touchmove",
event => { event.preventDefault() },
{passive: false} // ⭐️ important
);
If you want to remove a capturing event handler, you must also pass true as the third argument to removeEventListener().
⚠️ event.target's capturing handlers are NOT invoked❗️
capturing handlers can be used:
for debugging
to filter events so that the target event handlers are never actually invoked.
for handling mouse drags.
Last updated
Was this helpful?