Event Handler Return Values

A few event handlers associated with specific objects have extra powers available to them, based on whether the event handler contains a scripted return statement that returns trueor false. For example, an onClick event handler associated with a link ignores the action of the HREF and TARGET attributes if the event handler evaluates to return false. Similarly, a form object’s onSubmit event handler can cancel the submission of a form if the event handler evaluates to return false.

The easiest way to implement this feature is to include a return statement in the event handler itself, while the function invoked by the handler returns true or false based on its calculations. For example, if a form requires validation prior to submission, you can have the onSubmit event handler invoke the validation routine (probably passing this, the form itself, as a parameter to the function). If the routine finds a problem somewhere, it returns false and the submission is canceled; otherwise, it returns true and the submission proceeds as usual. Such a FORM element looks like the following:

<FORM METHOD="POST" ACTION="http://www.megaCo.com/cgi-bin/entry" 
onSubmit="return validate(this)">

This technique also allows you to have a link navigate to a hardcoded URL for nonscriptable browsers, but execute a script when the user has a scriptable browser:

<A HREF="someotherURL.htm" onClick="doNavigation(); return false">...</A>

Here, the return statement is set as the final statement ...

Get Dynamic HTML: The Definitive Reference now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.