Minggu, 13 Mei 2018

Pengertian dan Contoh Penggunaan Event Pada Javascript


Codins - Kembali lagi ke tutorial javascript. Sebelumnya kita telah belajar untuk membuat function pada javascript. Pada artikel ini kita akan sedikit mengenal Event serta contoh penggunaanya pada javascript. Untuk itu silakan untuk membacanya dengan seksama...

Pengertian Event Pada Javascript

Pada dasarnya event di javascript bisa diartikan sebagai suatu hal yang terjadi pada sebuah element di halaman web. Contoh nyatanya adalah ketika kita mengakses suatu website dan menekan tombol atau button yang memiliki event dan kemudian terjadi sesuatu ketika kita menekan button tersebut hal ini bisa dibilang event, atau ketika kita membuat sebuah tombol dan akan menampilkan teks ketika tombol diklik, maka eventnya adalah klik atau pada javascript dikenal dengan nama onclick.

Beberapa Jenis Event Pada Javascript

Berikut adalah beberapa jenis event yang biasa digunakan pada javascript : 
  • onclick  = event ketika sebuah elemen diklik
  • onkeydown = event ketika terjadi pengetikan pada elemen html
  • onload = event yang dijalankan ketika suatu elemen atau halaman web dibuka
  • onchange = event ketika sebuah elemen html mengalami perubahan
  • onmouseover = event ketika cursor mouse diletakkan pada suatu elemen ( tanpa mengekliknya )
  • onmouseout  = event ketika cursor mouse meninggalkan suatu element

Membuat Event Pada Javascript

Untuk membuat event pada javascript caranya cukup mudah, semisal kita akan membuat event ketika sebuah tombol diklik, maka scriptnya akan terlihat seperti : 
<button onclick="aksi yang akan dilakukan ketika event onclick (mengeklik tombol) dilakukan">Klik Disini</button>

Contoh Penggunaan Event Pada Javascript

Untuk memulainya buatlah sebuah file html baru dengan nama eventjs.html kemudian pada file tersebut isikan sintaks dibawah ini : 

Penjelasan sintaks diatas : 

  • Terlebih dulu kita membuat function untuk menampilkan tempat tinggal dengan nama tempat_tinggal()
  • Kemudian kita buat event onclick atau ketika diklik pada element button
  • Tempat tinggal akan ditampilkan pada element div dengan id data
Jika sudah simpan dan bukalah file diatas, maka akan tampil seperti screenshot dibawah ini :

Kemudian jika kita tekan tombol klik disini maka akan tulisan "saya tinggal di Yogyakarta" yang berasal dari function tempat_tinggal(), anda bisa lihat hasilnya pada screenshot dibawah ini : 

Itulah artikel saya mengenai Pengertian dan Contoh Penggunaan Event Pada Javascript. Jika masih kurang jelas silakan bertanya lewat komentar dibawah, semoga bermanfaat, terimakasih telah membaca!

Related Posts

Pengertian dan Contoh Penggunaan Event Pada Javascript
4/ 5
Oleh