Artikel Terbaru

Breaking

Thursday, July 27, 2017

Apa itu Event ?? yuk pelajari apa itu event di javascript(js)

Apa itu Event ??

Event adalah bagian dari javascript(js) yang menangani suatu action tertentu terhadap suatu object dokumen halaman website. Event dapat di gunakan pada sebuah object ketika di klik atau di double klik dan akan memanggil nama fungsi yang sudah di definisikan sebelumnya.

Berikut ini adalah macam-macam event yang bisa di gunakan dalam membangun websie yang dinamis.

1. Onload atau Unload

onLoad atau unLoad  Digunakan ketika membuka atau menutup halaman web. Bisa juga di gunakan untuk memeriksa jenis browser dan versinya. Di letakkan pada tag sebuah halaman website.

Sebagai contoh :

<html>
<head>
<title>Event onLoad dan onUnLoad</title>
<script> 
function loadHalaman()
{  
alert('Selamat Datang di website kami');
 }
function unloadHalaman()
{  
alert('Terima kasih sudah mengunjungi kami'); 
}
</script>
</head>
<body onLoad="loadHalaman()" onUnLoad="unloadHalaman()">
<h1>Penggunaan Event onLoad dan onUnload</h1>
 </html>


Keterangan : load halaman akan di eksekusi ketika halaman website di tampilkan unload halaman akan di eksekusi ketika halaman website di tutup.

Hasil dari script onload di atas



2. onFocus, onBlur dan onKeyUp

onFocus, onBlur dan onKeyUp adalah event yang di gunakan untuk kombinasi validasi inputan user pada sebuah form contohnya : validasi email, nomor telephone, dll. onFocus ialah ketika kursor kita terletak pada kolom text input, onBlur berarti  saat kursor di letakkan diluar kolom text input  dan onKeyUp terjadi ketika penggantian isi/nilai pada suatu kolom input text.

Berikut ini contoh Script nya :

<html>
<head>
<title>Event onLoad dan onUnLoad</title>
 <script> 
 function focusField()
 {  
 document.getElementById('ket').innerHTML = 'Nama kondisi onFocus';
 } 
 function blurField()
 {   document.getElementById('ket').innerHTML = 'Nama kondisi onBlur'; 
 }  function changeField(value) {   document.getElementById('ket').innerHTML = 'Isi nama: '+value; 
 }
 </script>
 </head>
 <body>
 <h1>Event onFocus, onBlur dan onKeyUp</h1>
 <form>
 <input type="text" id="nama" onFocus="focusField()" onBlur="blurField()" onKeyUp="changeField(this.value)">
 <span id="ket" />
 </form>
 </html>

Keterangan : onKeyUp<this.value> untuk mendapatkan value dari input text. Dan bisa juga di ganti dengan onKeyPress, tapi pesan yang di tampilkan berbeda atau tidak langsung di tampilkan.

Gambar dari hasil Script di atas 


Gambar di atas sebelum  ada action pada textfield




Gambar di atas ketika kursor di letakkan di dalam textfield


Gambar di atas ketika kursor di keluarkan dari textfield


Gambar di atas ketika textfield di isi



3. onSubmit dan onClick

onSubmit dan onClick adalah event yang di gunakan pada komponen form dan button. onSubmit membutuhkan sebuah nilai kembalian, karena ada 2 kondisi pada saat onSubmit melanjutkan submit form atau batal submit

berikut ini adalah script nya :

<html>
 <head>
 <title>Event onSubmit dan onClick</title>
 <script>  function cekForm()
 {  
 if (document.getElementById('nama').value=='')  
 {   
 alert('Nama harus diisi');   
 return false;  
 }  
 else return true; 
 }
  function cekNama()
  {  
  if (document.getElementById('nama').value=='')  
  {   
  alert('Nama harus diisi');   
  return false;  
  } 
  else return true;
  }
  </script>
  </head>
  <body>
  <h1>Penggunaan Event onSubmit dan onClick</h1>
  <form name="formcoba" action="proses.html" method="post" onSubmit="return cekForm()">
  <input type="text" name="nama" id="nama">
  <input type="submit" name="kirim" value=" Kirim" onClick="return cekNama()">
  </form>
  </html>


Keterangan : onSubmit dan onClick memiliki fungsi yang sama, onSubmit diletakkan pada form dan onClick di letakkan pada button.


Di bawah ini gambar dari Script di atas : 



Gambar di atas adalah event onSubmit dan onClick


Artikel di atas menjelaskan event yang ada di javascript(js).tentang onLoad dan unLoad,onFocus onBlur  dan onKeyUP,onSubmit dan onClick.saat ini itu saja yang admin bagikan kepada pembaca sekalian dan akan admin lanjutkan pada artikel selanjutnya.ini merupakan dasar dari Bahasa pemrograman javascrip(js). maka sering-seringlah berlatih agar ilmu kita semakin kuat dan menjadi programmer yang pintar. Dan yang perlu di ketahui javascript(js) bukan hanya di tujukan untuk pembuatan website tapi bisa di kembangkan lagi dengan membuat sebuah program dengan Bahasa kode tersebut semua tergantung pada bidang yang anda jalani dengan Bahasa program tersebut.
Mungkin saat ini itu saja artikel tentang Event yang ada di javascript(js).semoga artikel saya dapat bermanfaat dan juga dapat memberikan pengetahuan baru bagi pembaca semuanya.


Keep follow next article from LazyCodding

2 comments:

  1. Dapatkan Penghasilan Tambahan Dengan Bermain Poker Online di www,SmsQQ,com

    Keunggulan dari smsqq adalah
    *Permainan 100% Fair Player vs Player - Terbukti!!!
    *Proses Depo dan WD hanya 1-3 Menit Jika Bank Tidak Gangguan
    *Minimal Deposit Hanya Rp 10.000
    *Bonus Setiap Hari Dibagikan
    *Bonus Turn Over 0,3% + 0,2%
    *Bonus referral 10% + 10%
    *Dilayani Customer Service yang Ramah dan Sopan 24 Jam NONSTOP
    *Berkerja sama dengan 4 bank lokal antara lain : ( BCA-MANDIRI-BNI-BRI )

    Jenis Permainan yang Disediakan ada 8 jenis :
    Poker - BandarQ - DominoQQ - Capsa Susun - AduQ - Sakong - Bandar Poker - Bandar 66

    Untuk Info Lebih Lanjut Dapat menghubungi Kami Di :
    BBM: 2AD05265
    WA: +855968010699
    Skype: smsqqcom@gmail.com

    ReplyDelete
  2. Agan-Agan yang suka baca cerita dewasa saya recommend website yang bisa buat anda crottt puas.

    > Putihh Kental
    > Cerita Dewasa
    > Janda
    > Tante
    > Perawan
    > ABG
    > Selingkuhan

    ReplyDelete