เหตุการณ์ onreset: รันสคริปตเมื่อกดปุ่ม Reset ฟอร์ม

เหตุการณ์ onreset จะถูกกระตุ้นเมื่อฟอร์มถูกรีเซ็ต (ผู้ใช้กดปุ่ม <input type="reset"> หรือ <button type="reset">) ทำงานบนแท็ก <form>

ตัวอย่างการใช้งาน

<!DOCTYPE html>
<html>
<body>
    <form onreset="display()">
        <label>ชื่อนักศึกษา:<br>
            <input type="text" name="sname">
        </label><br>
        <label>วิชา:<br>
            <input type="text" name="ssubject">
        </label><br>
        <input type="reset" value="ล้างข้อมูล">
    </form>
    <script>
        function display() {
            alert("ฟอร์มถูกล้างข้อมูลแล้ว!");
            // หรือ: console.log('Form reset at', new Date());
        }
    </script>
</body>
</html>

พฤติกรรมของ Reset Button

• คืนค่า ทุกฟิลด์ ในฟอร์มกลับเป็น value เริ่มต้น (ค่าที่ตั้งไว้ใน HTML)
• ไม่ล้างค่าที่ผู้ใช้พิมพ์ หลังจากโหลดหน้า (ถ้าไม่ได้กด Reset)
• <input type="reset"> และ <button type="reset"> ทำงานเหมือนกัน
• ไม่ส่งข้อมูลไป Server (ต่างจาก Submit)

การใช้งานขั้นสูง: ยืนยันก่อน Reset

<form onreset="return confirmReset()">
    <!-- ฟิลด์ต่างๆ -->
    <button type="reset">ล้างฟอร์ม</button>
</form>

<script>
    function confirmReset() {
        return confirm('คุณแน่ใจหรือไม่ว่าต้องการล้างข้อมูลทั้งหมด?');
        // คืนค่า false = ยกเลิกการ reset
    }
</script>

เหตุการณ์ฟอร์มที่เกี่ยวข้อง