07 August 2014

Catatan Javascript: setTimeout

Hari ini mulai lagi saya belajar mengenai Javascript dan fungsi yang sedang saya pelajari adalah setTimeout. Fungsi ini berguna untuk memerintahkan Javascript melaksanakan perintah tertentu setelah beberapa waktu tertentu.
Misalnya saya mau Javascript menampilkan jendela alert setelah 10 detik maka ini mungkin dilakukan dengan perintah setTimeout. Pseudocode-nya adalah sebagai berikut:

var timer1 = 0;
timer1 = setTimeout( Tampilkan jendela alert, 10detik);

Ingat bahwa argumen pertama setTimeout adalah perintah yang akan dilaksanakan, bisa juga berupa fungsi. Argumen kedua adalah waktu timeout yang kita harapkan, misalnya dalam kasus di atas 10 detik.

Berikut ini contoh dari file yang saya gunakan untuk belajar setTimeout.html

<html>
  <head>
    <title>Coba setTimeout
    </title>
    <script type="text/javascript">
          function timeOutAlert( timess) {
                setTimeout(alert(timess) ,  timess);
          }
    </script>
  </head>
  <body onclick="timeOutAlert(1000);">
    mencoba fungsi setTimeout dengan menggunakan waktu timeout 1000
    <img width="1024" height="900"/>
  </body>
</html>

pada contoh ini saya membuat fungsi timeOutAlert yang menerima satu parameter yaitu timess. Pada bagian body dari html saya membuat sebuah container img agar body html bisa di klik dengan mouse pada permukaan yang cukup luas, hehe. Tenang saja sebab memang tidak akan muncul gambar apa pun. Kamu bisa memunculkan gambar dengan menambahkan attribut source="path ke gambar yang mau kamu tampilkan" pada tag img tersebut.
Setelah halaman ditampilkan dan anda melakukan klik pada halaman maka akan tampil jendela alert setelah waktu 1000 itu habis.

No comments:

Post a Comment