Lebak Cyber Tips dan Trik Komputer
Membuat Event di Javascript
lebakcyber.net – Membuat event di Javascript. Pada kesempatan tutorial belajar Javascript kali ini kita akan membahas mengenai bagaimana cara untuk membuat sebuah event pada bahasa pemrograman Javascript.
Event pada bahasa pemrograman Javascript merupakan sesuatu yang terjadi pada sebuah element, misalnya kita memiliki sebuah button atau tombol pada halaman web yang sedang kita buat dan kita menginginkan sebuah aksi kalau tombol tersebut diklik, jadi disini yang menjadi event adalah klik.
Contohnya kalau tombol atau button tersebut di klik maka nantinya akan menampilkan sebuah pesan atau kalimat. Jadi eventnya adalah pada saat di tombol di klik, dan berikut ini adalah beberapa event yang ada pada Javascript :
- onkeydown = sebuah event kalau terjadi pengetikan pada sebuah element di halaman html.
- onload = sebuah event kalau sebuah element atau halaman html dibuka.
- onmouseover = sebuah event kalau sebuah element pada halaman html diletakkan cursor mouse diatasnya.
- onmouseout = sebuah event kalau cursor mouse meninggalkan sebuah element yang ada pada halaman html.
- onclick = sebuah event kalau element pada halaman html di klik.
- onchange = sebuah event kalau sebuah element pada halaman html berubah.
Contoh Event Menggunakan Javascript
Oke sekarang kita akan coba untuk membuat event di Javascript, langsung saja buat sebuah file index.html baru lalu masukan perintah seperti dibawah ini :
<!DOCTYPE html>
<html>
<head>
<title>Contoh Event di Javascript</title>
</head>
<body>
<h1>Contoh Event di Javascript | lebakcyber.net</h1>
<button onclick="tampil_nama_web()">Klik Disini</button>
<div id="tampil"></div>
<script>
// membuat function tampilkan_nama
function tampil_nama_web(){
document.getElementById("tampil").innerHTML = "<h3>Selamat Datang di website lebakcyber.net</h3>";
}
</script>
</body>
</html>
Perhatikan pada perintah diatas ada sebuah tombol yang kita berikan event klik didalamnya, tepatnya pada bagian perintah :
<button onclick="tampil_nama_web()">Klik Disini</button>
Selanjutnya pada saat tombol atau button tersebut diklik nantinya akan menjalankan sebuah function tampil_nama_web, tepatnya pada bagian perintah dibawah ini :
function tampil_nama_web(){
document.getElementById("tampil").innerHTML = "<h3>Selamat Datang di website lebakcyber.net</h3>";
}
Dimana isi dari fungsi tampil_nama_web tersebut adalah untuk menampilkan kalimat “Selamat Datang di website lebakcyber.net”. Nanti hasilnya akan seperti pada gambar dibawah ini :
Lalu pada saat tombol tersebut diklik, maka hasilnya akan seperti pada gambar dibawah ini :
Oke jadi seperti itulah bagaimana cara untuk membuat sebuah event pada bahasa pemrograman Javascript, semoga tutorial sederhana ini dapat bermanfaat bagi kalian yang sedang belajar mengenai Javascript. Sampai jumpa di tutorial belajar Javascript selanjutnya ya.
