Stopping Default Behavior
Some elements have default behavior associated with certain events. For example, when a
user clicks on a link, the browser redirects to the site in the href attribute, while a form is
submitted when the user clicks on the submit button.
preventDefault() is a method of the event object that can be used inside the call-
back function to stop the default behavior occurring. To see an example, add the following
line to the events.htm file:
<a id="broken" href="http://sitepoint.com">Broken Link</a>
Then add the following event listener inside the script.js file:
var broken = document.getElementById("broken");
This will stop the page from redirecting to the page specified in the href attribute and show
the message in the console instead.
Warning: Use preventDefault() with Caution
Make sure that you think carefully before using preventDefault() to
change default behavior. Users will expect certain behaviors and preventing
them may cause confusion.
Some events do not allow the default behavior to be prevented. This can vary
from browser to browser, but each event object has a property called can-
cellable that returns false if it cannot be prevented.
Search WWH ::