JS Events

Event adalah tindakan yang dapat dideteksi oleh JavaScript .


Event

Dengan menggunakan JavaScript, kita bisa membuat halaman web yang dinamis . Event adalah tindakan yang dapat dideteksi oleh JavaScript .

Setiap elemen pada halaman web memiliki peristiwa-peristiwa tertentu yang dapat memicu JavaScript . Sebagai contoh, kita dapat menggunakan event onClick dari sebuah elemen tombol untuk menunjukkan bahwa suatu fungsi akan berjalan ketika pengguna mengklik tombol . Kami mendefinisikan peristiwa dalam tag HTML .

Contoh Event:
  • Klik mouse
  • Loading image
  • Mousing hover
  • Memilih field input dalam bentuk HTML
  • Mengirimkan form dalam bentuk HTML
  • Keystroke

Catatan: Event biasanya digunakan secara kombinasi dengan fungsi, dan fungsi tersebut tidak akan dieksekusi sebelum peristiwa itu terjadi!. 


onLoad dan onUnload

Event onLoad dan onUnload dipicu ketika pengguna memasuki atau meninggalkan halaman. Event onLoad sering digunakan untuk memeriksa jenis browser dan versi browser pengunjung , dan memuat versi yang tepat dari halaman web berdasarkan informasi yang diterima.

Baik onLoad dan onUnload Event juga sering digunakan untuk menangani cookie yang harus ditetapkan ketika pengguna memasuki atau meninggalkan halaman. Sebagai contoh, anda bisa membuat popup untuk meminta nama pengguna pada saat kedatangan pertamanya ke halaman anda . Nama ini kemudian disimpan dalam cookie. Pada waktu yang lain ketika pengunjung yang sama tiba di halaman anda, anda bisa membuat popup lain dan mengatakan sesuatu seperti : " Welcome John Doe !".


onFocus , onBlur dan onChange

Event onFocus , onBlur dan onChange sering digunakan dalam kombinasi dengan validasi form. Di bawah ini adalah contoh bagaimana menggunakan event onChange .FUngsi checkEmail() akan dipanggil setiap kali pengguna mengubah isi dari inputan :

<input type="text" size="30" id="email" onchange="checkEmail()">
Event onSubmit digunakan untuk memvalidasi semua kolom formulir sebelum mengirimkan itu. Di bawah ini adalah contoh bagaimana menggunakan event onSubmit . Fungsi checkForm() akan dipanggil saat pengguna mengklik tombol submit dalam form. Jika nilai-nilai filed / inputan tidak diterima, submit harus dibatalkan. Fungsi checkForm() mengembalikan nilai true atau false. Jika return true form akan dikirimkan, jika tidak akan dibatalkan :

<form method="post" action="xxx.htm" onsubmit="return checkForm()">


onMouseOver dan onMouseOut

onMouseOver dan onMouseOut sering digunakan untuk membuat tombol "animasi". Di bawah ini adalah contoh dari suatu event onMouseOver . Sebuah kotak peringatan muncul saat Event onMouseOver terdeteksi :

<a href="http://www.hadinug.net" onmouseover="alert('Sebuah Event onMouseOver');return false"> hover me</ a>
 
Bagikan halaman ke sosial media
 
 
 

   Komentar Anda