The story on return false

In JavaScript event handlers, you'll frequently see return false; at the end. Why? What does it do? The answer is: It depends. Before we get into the details, there are basically two things it could be doing:

1. Preventing the default action of the event, such as when you click a link and the browser follows it.
2. Stopping propagation of the event to ancestor elements.

So which does return false do? Just one, neither, or both:

• DOM0 handlers: In an old-style DOM0 handler, hooked up via an attribute like this:

  <div onclick="return functionName();">

  ...it prevents the default action but doesn't stop propagation. Note that you need that return in the attribute. Try it here.
• DOM2 handlers: In a proper DOM2 handler hooked up via addEventListener, return false does absolutely nothing. Instead, use the preventDefault and stopPropagation functions on the Event object your handler receives as an argument. Try it here (be sure to use a non-Microsoft browser, or use IE9 or higher).
• Microsoft DOM2-ish handlers: In a DOM2-ish handler hooked up with Microsoft's attachEvent function, return false prevents the default but not propagation, just like a DOM0 handler. Try it here (using IE8 or lower).
• jQuery handlers: Event handlers hooked up with jQuery get a twofer: return false both prevents the default and stops propagation. It's a jQuery thing.

Happy handling!