Mengapa "return false" tidak berfungsi?

Kenapa pada kode dibawah return false tidak berfungsi sama sekali?

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

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

browser akan mengikuti URL yang di klik, tapi kita tidak mau hal itu terjadi.

Bagaimana cara memperbaikinya?

Pada saat browser membaca atribut on* seperti onclick, browser akan membuat sebuah penangan (handler) dari kontennya.

Untuk onclick"handler()" fungsinya akan menjadi:

          function(event) {
  handler() // konten dari onclick
}
        

Sekarang kita bisa melihat bahwa nilai yang dikembalikan oleh handler() tidak digunakan dan tidak mempengaruhi hasilnya.

Cara memperbaikinnya mudah:

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

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

Kita juga bisa menggunakan event.preventDefault(), seperti ini:

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

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