เพิ่มเติม "Try it Yourself" ตัวอย่างด้านล่าง
ความหมายและการใช้งาน
เหตุการณ์ onload เกิดขึ้นเมื่อวัตถุได้รับการโหลด
onload ที่ใช้บ่อยที่สุดใน <body> องค์ประกอบรันสคริปต์ครั้งหน้าเว็บที่มีการโหลดสมบูรณ์เนื้อหาทั้งหมด (รวมถึงรูปภาพไฟล์สคริปต์ไฟล์ CSS, ฯลฯ )
เหตุการณ์ onload สามารถนำมาใช้ในการตรวจสอบของผู้เข้าชมประเภทเบราว์เซอร์และเบราว์เซอร์รุ่นและโหลดรุ่นที่ถูกต้องของหน้าเว็บบนพื้นฐานของข้อมูล
เหตุการณ์ onload ยังสามารถนำมาใช้ในการจัดการกับ cookies (ดู "More Examples" ด้านล่าง)
สนับสนุนเบราว์เซอร์
| เหตุการณ์ | |||||
|---|---|---|---|---|---|
| onload | ใช่ | ใช่ | ใช่ | ใช่ | ใช่ |
วากยสัมพันธ์
ใน HTML:
ใน JavaScript:
object .onload=function(){ ลองตัวเอง» ใน JavaScript โดยใช้ addEventListener() วิธีการ:
object .addEventListener("load", myScript );
ลองตัวเอง» หมายเหตุ: addEventListener() วิธีการที่ไม่ได้รับการสนับสนุนใน Internet Explorer 8 และรุ่นก่อนหน้านี้
รายละเอียดทางเทคนิค
| บับเบิ้ล: | ไม่ |
|---|---|
| ยกเลิก: | ไม่ |
| ประเภทเหตุการณ์: | UIEvent ถ้าสร้างจากอินเตอร์เฟซผู้ใช้ที่จัดกิจกรรมอย่างอื่น |
| แท็ก HTML ที่รองรับ: | <body> <เฟรม> <iframe> <img> <input type = "ภาพ"> <ลิงก์> <script> <style> |
| DOM เวอร์ชัน: | ระดับที่ 2 เหตุการณ์ |
ตัวอย่างอื่น ๆ
ตัวอย่าง
ใช้ onload บน <img> องค์ประกอบ การแจ้งเตือน "Image is loaded" ทันทีหลังจากที่ภาพได้รับการโหลด:
<img src="w3javascript.gif" onload="loadImage()" width="100" height="132">
<script>
function loadImage() {
alert("Image is
loaded");
}
</script>
ลองตัวเอง» ตัวอย่าง
ใช้เหตุการณ์ onload ที่จะจัดการกับคุกกี้:
<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>
ลองตัวเอง» <object เหตุการณ์