Posted about 8 years ago. Visible to the public. Repeats.

Cancelling event propagation with jQuery

Within an event handler, there are no less than 4 methods to cancel event propagation, each with different semantics.

  • event.preventDefault()

    Only prevents the default browser behavior for the click, i.e. going to a different url or submitting a form.

  • event.stopPropagation()

    Only prevents the event from bubbling up the DOM. Note this effectively also cancels any event handlers attached through jQuery's live method, since those depend on bubbling.

  • event.stopImmediatePropagation()

    Prevents the event from bubbling up the DOM.
    Additionally prevents any further event handlers bound on the same element.

  • returning false in the event handler

    The same as preventDefault followed by stopPropagation. Will not prevent event handlers bound on the element itself.

Once an application no longer requires constant development, it needs periodic maintenance for stable and secure operation. makandra offers monthly maintenance contracts that let you focus on your business while we make sure the lights stay on.

Owner of this card:

Avatar
Tobias Kraze
Last edit:
over 2 years ago
by Pascal Schmid
Keywords:
javascript, return, false, bubble, event, stop, other, event, listeners, disable
About this deck:
We are makandra and do test-driven, agile Ruby on Rails software development.
License for source code
Posted by Tobias Kraze to makandra dev
This website uses cookies to improve usability and analyze traffic.
Accept or learn more