Sebelum gue ngebahas touch events, gue mau ngebahas method preventDefault() dulu. Sering gue method nemu ini, tapi gue belum ngerti apa pentingnya method ini.

The Definition

preventDefault() adalah sebuah method untuk ngasih tau browser bahwa event yang akan dijalankan tidak ditangani sebagaimana mestinya.

Syntax

event.preventDefault();

Example

Saya pengen sebuah link dalam sebuah paragraf yang harusnya mengarah ke https://dekadensiotak.id tidak mengarah ke sana, melainkan menampilkan sebuah alert.

ini html-nya,

  <p id="paragraf">
    Halo, silakan kunjungi <a class="link" href="https://dekadensiotak.id">website ini</a>.
  </p>

saya manipulasi DOM-nya,

const klik = document.getElementById('paragraf');

klik.addEventListener('click', function(event){
  event.preventDefault();
  alert("hey bangsyat!");
});

Nah itu link jadi gak bisa direct ke alamat yang ada di href nya. Malah ngeluarin alert.