Pourquoi "return false" ne fonctionne pas?

Pourquoi dans le code ci-dessous return false ne fonctionne pas?

<script>
  function handler() {
    alert( "..." );
    return false;
  }
</script>

<a href="https://w3.org" onclick="handler()">le navigateur va aller sur w3.org</a>

Le navigateur suit le lien lors du clic, mais nous ne voulons pas ça.

Comment réparer ce problème?

Lorsque le navigateur lit l’attribut on*, comme onclick, il créer le gestionnaire depuis son contenu.

Pour onclick="handler()" la fonction sera:

          function(event) {
  handler() // le contenu de onclick
}
        

Maintenant nous pouvons voir que la valeur retournée par handler() n’est pas utilisée et n’affecte pas le résultat.

La correction est simple:

<script>
  function handler() {
    alert("...");
    return false;
  }
</script>

<a href="https://w3.org" onclick="return handler()">w3.org</a>

Nous pouvons aussi utiliser event.preventDefault(), comme ceci:

<script>
  function handler(event) {
    alert("...");
    event.preventDefault();
  }
</script>

<a href="https://w3.org" onclick="handler(event)">w3.org</a>