Cara Penggunaan Timing Event Pada JavaScript

Timing Even adalah sebuah jendela object yang memungkinkan kita bagi mengesekusi atau menjalankan petunjuk tertentu sesuai dengan waktu yang di tentukan. Cara Pemakaian Timing Event Di JavaScript terdapat dua cara diantaranya yaitu, setTimeout() dan clearTimeout().




  • setTimeout() adalah sebuah method yang berfungsi bagi mengesekusi sebuah kode beberapa waktu tertentu bagi struktur penulisannya yaitu seperti di bawah ini





var time = setTimeout(javascript statement, milli seconds);


ket :



setTimeout adalah sebuah method yang berfungsi bagi mengembalikan nilai, dan nilai tersebut disimpan pada variable time, sedangkan parameter kedia adalah berapa banyak atau berapa lama waktu yang diperlukan bagi mengesekusi script yang terdapat di parameter pertama-tama, dan yang mesti kita ketahui bahwa 1000 milidetik sama dengan 1 (satu) detik.



Bagi contoh pemakaian dari setTimeout() yaitu seperti dibawah ini :



<!DOCTYPE html>
<html>
<head>
<title>Cara Pemakaian Timing Event Di JavaScript</title>
</head>
<body>
<form>
<input type=button value=seandainya diklik karenanya akan muncul alert dalam rentang waktu 5 detik onclick=waktuPesan() />
</form>

<img src=data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7 data-wp-preserve=%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0A%09%09function%20waktuPesan()%0A%09%09%7B%0A%09%09%09var%20time%3DsetTimeout(%22alertMsg()%22%2C5000)%3B%0A%09%09%7D%0A%09%09%09function%20alertMsg()%0A%09%09%7B%0A%09%09%09alert(%22Hello%20Dumet%20School%22)%3B%0A%09%09%7D%0A%09%3C%2Fscript%3E data-mce-resize=false data-mce-placeholder=1 class=mce-object width=20 height=20 alt=Timing Even adalah sebuah jendela object yang memungkinkan kita bagi mengesekusi atau Cara Pemakaian Timing Event Di JavaScript title=Cara Pemakaian Timing Event Di JavaScript />
</body>
</html>


Sekiranya kita jalankan karenanya akan terlihat hasilnya seperti dibawah ini :



Timing



Demo




  • ClearTimeout() adalah kebalikan dari setTimeout(), clearTimeout() berfungsi bagi mengcancel petunjuk dari setTimeout() jadi di dikala waktu yang telah ditentukan belum terpenuhi karenanya kita dapat mengcencel proses yang terdapat di pada setTimeout().



Bagi struktur penulisan dari clearTimeout() yaitu seperti dibawah ini :



clearTimeout(timeoutId);



ket : timeOutId adalah return dari setTimeout() bagi contoh penggunaannya yaitu seperti dibawah ini :



<!DOCTYPE html>
<html>
<head>
<title>Cara Pemakaian Timing Event Di JavaScript</title>
</head>
<body>

<input type=button id=btn-check value=timeout onclick=alertCheck()/>

<img src=data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7 data-wp-preserve=%3Cscript%20type%3D%22text%2Fjavascript%22%20src%3D%22https%3A%2F%2Fcode.jquery.com%2Fjquery-3.3.1.min.js%22%3E%3C%2Fscript%3E data-mce-resize=false data-mce-placeholder=1 class=mce-object width=20 height=20 alt=Timing Even adalah sebuah jendela object yang memungkinkan kita bagi mengesekusi atau Cara Pemakaian Timing Event Di JavaScript title=Cara Pemakaian Timing Event Di JavaScript />
<img src=data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7 data-wp-preserve=%3Cscript%20type%3D%22text%2Fjavascript%22%3E%0Afunction%20alertCheck()%7B%0A%09if(%24('%23btn-check').val()%20%3D%3D%20'timeout')%7B%0A%09%09%24('%23btn-check').val('stop%20cek')%3B%0A%09%09alertTimeId%20%3D%20setTimeout('tampilAlert()'%2C5000)%3B%2F%2F%20timeoutId%0A%09%09%7Delse%7B%0A%09%09%24('%23btn-check').val('timeout')%3B%0A%09%09clearTimeout(alertTimeId)%3B%2F%2F%20timeoutId%0A%09%7D%0A%7D%0A%0Afunction%20tampilAlert()%7B%0A%09alert('Kamu%20Terlambat%20Click%20Stop')%3B%0A%09%24('%23btn-check').val('timeout')%3B%0A%7D%0A%0A%3C%2Fscript%3E data-mce-resize=false data-mce-placeholder=1 class=mce-object width=20 height=20 alt=Timing Even adalah sebuah jendela object yang memungkinkan kita bagi mengesekusi atau Cara Pemakaian Timing Event Di JavaScript title=Cara Pemakaian Timing Event Di JavaScript />
</body>
</html>


Sekiranya kita jalankaan karenanya akan terlihat hasilnya seperti dibawah ini :



Timing



Demo



Oke teman-teman begitulah pembahasan kita tetang Cara Pemakaian Timing Event Di JavaScript.



Semoga bermanfaat.



Terima kasih.




Sumber https://kursuswebsite.org

Popular posts from this blog

Perbedaan Antara Keyup dan Keydown Pada jQuery

Membuat Table Warna Berselang dengan PHP