JavaScript Event defaultPrevented Property

Beginner
5 min read
Updated: Nov 2026
3 examples
Property
Decorative image with the word DEFAULTPREVENTED

Definition

Event.defaultPrevented is a read-only boolean. It is true if preventDefault() successfully canceled the event’s default action, and false otherwise. (MDN: Baseline Widely available since July 2015; also in Web Workers.)

Read the notes below before you rely on this property. Prefer feature detection when support is limited.

Syntax

Use event.defaultPrevented. Start with this line.

JavaScript
event.defaultPrevented
CallWhat it does
event.defaultPreventedPrimary signature.

Built into the browser. Read event.defaultPrevented on an Event instance — no import required.

Library declarations
JavaScript
event.defaultPrevented

Parameters

ParameterDescription
cancelableRequired. Must be true or the flag stays false

Return Value

Return ValueDescription
*The current value of event.defaultPrevented.

JavaScript Examples

Example 1 — Read After preventDefault()

See the flag flip from false to true on the same event object.

JavaScript
button.addEventListener("click", (event) => {
  console.log("before:", event.defaultPrevented); // false
  event.preventDefault();
  console.log("after:", event.defaultPrevented);  // true
});
Try It Yourself

How It Works

  1. Start false. Before cancel, defaultPrevented is false.
  2. Call preventDefault. On a cancelable click/submit, this sets the canceled flag.
  3. Read again. Same event now reports true.
  4. Default blocked. The browser will not run the normal action for that event.

Example 2 — Non-Cancelable Events Stay false

Synthetic events default to cancelable: false. Cancel only works when you opt in.

JavaScript
const soft = new Event("save"); // cancelable: false
soft.preventDefault();
console.log(soft.defaultPrevented); // false

const hard = new Event("save", { cancelable: true });
hard.preventDefault();
console.log(hard.defaultPrevented); // true
Try It Yourself

How It Works

  1. Default constructor. new Event("save") is not cancelable.
  2. Call is a no-op. preventDefault() does nothing → flag stays false.
  3. Opt in. Pass { cancelable: true } for custom events you want to cancel.
  4. Then it sticks. preventDefault() sets defaultPrevented to true.

Example 3 — Document Listener (MDN Pattern)

A later listener reads whether an earlier handler already canceled the default.

JavaScript
function stopLink(event) {
  event.preventDefault();
}

function logClick(event) {
  if (event.target.tagName !== "A") return;
  console.log(
    event.defaultPrevented
      ? "Sorry, but you cannot visit this link!"
      : "Visiting link…"
  );
}

document.getElementById("link2").addEventListener("click", stopLink);
document.addEventListener("click", logClick);
Try It Yourself

How It Works

  1. Target handler first. link2 calls preventDefault() on click.
  2. Bubble continues. The event still reaches document (unless someone stopped it).
  3. Read the flag. Document logic sees defaultPrevented === true for link 2.
  4. Branch the message. Free links log “Visiting…”; canceled ones log the apology.
Compatibility

Browser Support

Event.defaultPrevented is marked Baseline Widely available on MDN (since July 2015). It is also available in Web Workers.

✓ Baseline · Widely available

Event.defaultPrevented

Read-only boolean: true if preventDefault() canceled the event’s default action. Supported across modern browsers and legacy IE for this DOM property.

Universal Widely available
Google Chrome All versions · Desktop & Mobile
Full support
Mozilla Firefox All versions · Desktop & Mobile
Full support
Apple Safari All versions · macOS & iOS
Full support
Microsoft Edge All versions · Chromium & Legacy
Full support
Internet Explorer IE 6+ · Legacy environments
Full support
Opera All modern versions
Full support
Event.defaultPrevented Excellent

Bottom line: Safe to use in production. Pair with cancelable + preventDefault(); read the flag (or dispatchEvent’s return) to confirm cancel.

Frequently Asked Questions

It is a read-only boolean on an Event. It is true if Event.preventDefault() successfully canceled the event’s default action, and false otherwise.
No. MDN marks Event.defaultPrevented as Baseline Widely available (since July 2015). It is not Deprecated, Experimental, or Non-standard. It is also available in Web Workers.
preventDefault() only works when event.cancelable is true (and the listener is not passive). If the event is not cancelable, calling preventDefault() does not set defaultPrevented to true.
In a later listener (for example on document) to see if an earlier handler already canceled the default—useful for logging, analytics, or shared click handlers.
No. stopPropagation stops further travel through the DOM. defaultPrevented only reflects a successful preventDefault() cancel of the browser default action.
For a cancelable event, target.dispatchEvent(event) returns false if preventDefault() was called during dispatch (defaultPrevented is true). It returns true if the default was not prevented.

Next: eventPhase

See whether you are in capture, at the target, or bubbling.

eventPhase tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

9 people found this page helpful

JavaScript Event currentTarget Property JavaScript Event eventPhase Property