Friday, December 28, 2012

Register Event Handler Via DOM

Sebelumnya...
Fungsi yang menghandle event dinamakan event handler. Proses meregister event handler kepada event di suatu node DOM dinamakan registering an event handler.

Untuk meregister event handler kepada suatu event di dalam DOM, bisa gunakan metode addEventListener().

Selain via DOM untuk meregister event handler, juga bisa menggunakan cara 'tradisional model' atau 'inline model' untuk melakukannya.

Sintaks:

Obj.addEventListener(type, listener, useCapture)
  • Untuk Obj bisa elemen HTML, CommentNode, document, DocumentFragment, Text node, window, XMLDocument, atau XMLHttpRequest.
  • Untuk type adalah nama event handler yang prefix-nya ditiadakan, misal 'onclick' menjadi 'click', 'onmouseover' menjadi 'mouseover', dst.
  • Untuk function adalah event handler yang akan dipanggil ketika event ini terjadi.
  • Untuk useCapture adalah boolean, true atau false.

Berikut contoh meregister event handler bernama handleClick kepada event 'click' untuk elemen BUTTON:

<BUTTON ID="buttonID">Klik tombol ini</BUTTON> <SCRIPT TYPE="text/javascript"> function handleClick(){ alert("Halo saya event handler!"); } var buttonElem = document.getElementById("buttonID"); buttonElem.addEventListener("click", handleClick, false); </SCRIPT>

Catatan: Nama lain event handler adalah event listener atau EventListener.