Event: cancelable property

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Note: This feature is available in Web Workers.

The cancelable read-only property of the Event interface indicates whether the event can be canceled, and therefore prevented as if the event never happened.

If the event is not cancelable, then its cancelable property will be false and the event listener cannot stop the event from occurring.

Most browser-native events that can be canceled are the ones that result from the user interacting with the page. Canceling the click, wheel, or beforeunload events would prevent the user from clicking on something, scrolling the page with the mouse wheel, or navigating away from the page, respectively.

Synthetic events created by other JavaScript code define if they can be canceled when they are created.

To cancel an event, call the preventDefault() method on the event. This keeps the implementation from executing the default action that is associated with the event.

Event listeners that handle multiple kinds of events may want to check cancelable before invoking their preventDefault() methods.

Value

A boolean value, which is true if the event can be canceled.

Example

For example, browser vendors are proposing that the wheel event can only be canceled the first time the listener is called — any following wheel events cannot be canceled.

js
function preventScrollWheel(event) {
  if (typeof event.cancelable !== "boolean" || event.cancelable) {
    // The event can be canceled, so we do so.
    event.preventDefault();
  } else {
    // The event cannot be canceled, so it is not safe
    // to call preventDefault() on it.
    console.warn(`The following event couldn't be canceled:`);
    console.dir(event);
  }
}

document.addEventListener("wheel", preventScrollWheel);

Specifications

Specification
DOM
# ref-for-dom-event-cancelable②

Browser compatibility

Report problems with this compatibility data on GitHub
desktopmobileserver
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
Deno
Node.js
cancelable

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support