¿Por qué "return false" no funciona?

¿Por qué en el código de abajo return false no funciona en absoluto?

<script> function handler() { alert( "..." ); return false; } </script> <a href="https://w3.org" onclick="handler()">el navegador irá a w3.org</a>

El navegador sigue la URL al hacer clic, pero no la queremos.

¿Como se arregla?

Cuando el navegador lee un atributo on* como onclick, crea el controlador a partir de su contenido.

Para onclick="handler()" la función será:

function(event) { handler() // el contenido de onclick }

Ahora podemos ver que el valor devuelto por handler() no se usa y no afecta el resultado.

La solución es simple:

<script> function handler() { alert("..."); return false; } </script> <a href="https://w3.org" onclick="return handler()">w3.org</a>

También podemos usar event.preventDefault(), así:

<script> function handler(event) { alert("..."); event.preventDefault(); } </script> <a href="https://w3.org" onclick="handler(event)">w3.org</a>