Peristiwa onload

Definisi dan penggunaan

Peristiwa onload terjadi setelah objek di muat.

Peristiwa onload paling sering digunakan di dalam elemen <body>, untuk menjalankan skrip setelah halaman telah dimuat sepenuhnya (termasuk gambar, berkas skrip, berkas CSS, dll).

Peristiwa onload dapat digunakan untuk memeriksa tipe dan versi browser pengunjung dan memuat versi halaman yang benar berdasarkan informasi ini.

Peristiwa onload juga dapat digunakan untuk menangani cookie (lihat contoh di bawah ini).

Contoh

Melaksanakan JavaScript segera setelah halaman diunggah:

<body onload="myFunction()">

Coba sendiri

Contoh 2

Menggunakan onload di elemen <img>. Sementara gambar sedang diunggah, tampilkan peringatan "Gambar sudah diunggah":

<img src="w3javascript.gif" onload="loadImage()" width="100" height="132">
<script>
function loadImage() {
  alert("Image is loaded");
}
</script>

Coba sendiri

Contoh 3

Menggunakan peristiwa onload untuk menangani cookie:

<body onload="checkCookies()">
<script>
function checkCookies() {
  var text = "";
  if (navigator.cookieEnabled == true) {
    text = "Cookies are enabled.";
  } else {
     text = "Cookies are not enabled.";
  }
  document.getElementById("demo").innerHTML = text;
}
</script>

Coba sendiri

Sintaks

Pada HTML:

<element onload="myScript">

Coba sendiri

Pada JavaScript:

object.onload = function(){myScript};

Coba sendiri

Pada JavaScript, gunakan metode addEventListener():

object.addEventListener("load", myScript);

Coba sendiri

Keterangan:Internet Explorer 8 atau sebelumnya tidak mendukung Metode addEventListener()

Detil teknis

Pembubukan: Tidak didukung
Dapat dibatalkan: Tidak didukung
Tipe peristiwa: Jika dihasilkan dari antarmuka penggunaUiEvent。Jika tidak Event
Tanda HTML yang didukung: <body>, <frame>, <iframe>, <img>, <input type="image">, <link>, <script>, <style>
Versi DOM: Level 2 Events

Dukungan Browser

Event Chrome IE Firefox Safari Opera
onload Dukungan Dukungan Dukungan Dukungan Dukungan