DHTML จัดการเหตุการณ์ (Event Handlers)

คุณสามารถทำการปฏิบัติบางสิ่งกับองค์ประกอบในระหว่างเกิดเหตุการณ์บางอย่างโดยใช้ event handler

ตัวอย่าง

หมายเหตุ:ส่วนใหญ่ของตัวอย่าง DHTML ต้องการ IE 4.0+ หรือ Netscape 7+ หรือ Opera 7+!

onmouseover และ onmouseout
ฝากสีขององค์ประกอบเมื่อตัวชนะมุมมองย้ายไปและย้ายออก
onclick
ไฟจะติดแสง. แล้วจะได้กลับไปเป็นภาพดั้งเดิมเมื่อคลิกภาพอีกครั้ง
onmousedown และ onmouseup
ครั้งนี้แค่เมื่อคุณกดปุ่มเมาส์และเปิดปุ่มเมาส์ล่วงหน้านี้แล้วไฟจึงจะติดแสง
onload
แสดงตัวกระดาษประกาศหลังจากหน้าเว็บเสร็จการโหลด

event handler

ผ่านทาง event handler คุณสามารถทำการปฏิบัติบางสิ่งกับองค์ประกอบในระหว่างเกิดเหตุการณ์บางอย่าง: เมื่อมีการคลิกองค์ประกอบ หรือเมื่อหน้าเว็บเข้ารับการโหลด หรือเมื่อฟอร์มถูกส่ง และอื่นๆ

<h1 onclick="style.color='red'">คลิกบนข้อความนี้</h1>

ตัวอย่างดังกล่าวสามารถกำหนดให้ข้อหัวเรื่องเปลี่ยนเป็นสีแดงเมื่อมีการคลิกข้อหัวเรื่อง

คุณก็สามารถเพิ่มบรรทัดสคริปต์ในส่วน head ของหน้าแบบไลน์ และเรียกใช้ฟังก์ชันจากที่มีการจัดการเหตุการณ์: เมื่อมีการคลิกเมื่อผู้ใช้คลิกแหล่งข้อมูลหรือเมื่อหน้าเว็บเข้ารับการโหลดแล้ว หรือเมื่อฟอร์มถูกส่ง และอื่นๆ

<html>
<head>
<script type="text/javascript">
function changecolor()
{
document.getElementById('header').style.color="red"
}
</script>
</head>
<body>
<h1 id="header" onclick="changecolor()">คลิกบนข้อความนี้</h1>
</body>
</html>

จัดการเหตุการณ์ HTML 4.0

เหตุการณ์ เมื่อ...
onabort ผู้ใช้หยุดการโหลดหน้า
onblur ผู้ใช้ออกจากวัตถุ
onchange ผู้ใช้เปลี่ยนค่าของวัตถุ
onclick ผู้ใช้คลิกวัตถุ
ondblclick ผู้ใช้คลิกทับวัตถุ
onfocus ผู้ใช้กระตุ้นวัตถุ
onkeydown กดแป้นบนแป้นพิมพ์
onkeypress กดแป้นบนแป้นพิมพ์
onkeyup ปล่อยแป้นบนแป้นพิมพ์
onload

หน้าเว็บเสร็จที่จะทำงาน

หมายเหตุ:ใน Netscape จะมีเหตุการณ์นี้เกิดขึ้นเมื่อหน้าเว็บได้ทำงานเสร็จ
onmousedown ผู้ใช้กดแป้นหมุน
onmousemove ตามหมุนเซนเซอร์เคลื่อนที่บนวัตถุ
onmouseover ตามหมุนเซนเซอร์ขึ้นบนวัตถุ
onmouseout ตามหมุนเซนเซอร์หลุดจากวัตถุ
onmouseup ผู้ใช้ปล่อยแป้นหมุน
onreset ผู้ใช้ตั้งค่าฟอร์ม
onselect ผู้ใช้เลือกสิ่งที่อยู่บนหน้า
onsubmit ผู้ใช้ส่งฟอร์ม
onunload ผู้ใช้ปิดหน้า