หน่วยที่ 10 Objects and Event handling

หัวข้อเนื้อหา ความหมายของ Event handler การใช้ Event handling(OnAbort) การใช้ Event handling (Onblur) การใช้ Event handling(OnClick) การใช้ Event handling (OnMouseOver) การใช้ Event handling(OnMouseOut) การใช้ Event handling (OnChange) การใช้ Event handling(OnLoad) การใช้ Event handling (OnUnload) การใช้ Event handling(OnError) การใช้ Event handling (OnFocus) การใช้ Event handling(OnReset) ,OnSelect , Window Object

ความหมาย Events Handler อีเวนต์แฮนด์เลอร์ (Events Handler) คือ การ ตอบสนองต่อเหตุการณ์ที่เกิดขึ้นจากการสั่งงาน(Event) เช่น การคลิกเมาส์ การวางเมาส์ การเลื่อนเมาส์ ซึ่ง จะสามารถกำหนดได้ว่าเมื่อเกิดเหตุการณ์ดังกล่าวขึ้นมาแล้วจะ ให้เว็บเพจแสดงผลอย่างไร ซึ่ง Event ของ Java Script มี

Event ของ Java Script มีดังต่อไปนี้ Abort Focus MouseOut Submit Blur DbClick Unload MouseOver KeyPress Click Resize Move MouseUp KeyDown KeyUp Reset Load MouseDown DragDrop Change Error Select MouseMove

Event Handler มาตรฐานของ Java Script สามารถแสดงได้ ดังนี้ OnAbort OnBlur Onchange OnClick OnError OnFocus OnLoad OnMouseOut OnMouseOver OnReset OnSelect OnUnload

ค่า Object ในจาวาสคริปท์ที่มีผลมาจาก Event Handler ค่า Object ในจาวาสคริปท์ที่มีผลมาจาก Event Handler Object ต่าง ๆ ที่มีคุณสมบัติใช้งานกับเหตุการณ์ต่าง ๆ ของจาวาสคริปท์มี ดังนี้ Object Event Handler Button OnClick Reset OnClick Submit OnClick Radio OnClick CheckBox OnClick Link OnClick, OnMouseOver , OnMouseOut Form OnSubmit , OnReset Text OnChange , OnFocus , Onblur , OnSelect Textarea OnChange , OnFocus , OnBlur , OnSelect Select OnChange , OnFocus , OnBlur , OnSelect Image OnAbort , OnError Area OnClick, OnMouseOver , OnMouseOut Window Onload , OnUnload , OnError

ความหมายของ Event Handler ต่าง ๆ มีดังต่อไปนี้ OnSubmit เมื่อมีการตอบตกลงของฟอร์มออบเจ็กต์ OnClick เมื่อมีการนำเมาส์ไปคลิกบนออบเจ็กต์ OnFocus เมื่อออบเจ็กต์ได้รับโฟกัส Onchange เมื่อมีการเปลี่ยนแปลง เช่น มีการแก้ไข ข้อความบนเท็กท์ ออบเจ็กต์ ออบเจ็กต์จะรับรู้ว่ามีการเกิดเหตุการณ์ OnLoad เมื่อออบเจ็กต์ถูกโหลดเข้าสู่หน่วยความจำ OnBlur เมื่อออบเจ็กต์เสียโฟกัส OnMouseOver เมื่อมีเมาส์ลากผ่านออบเจ็กต์ OnAbort เมื่อมีการยกเลิก เช่น เมื่อมีรูปภาพกำลังปรากฎขึ้นแต่มี การ สั่งยกเลิกก่อน OnSelect เมื่อมีการเลือกข้อความบนออบเจ็กต์ OnError เมื่อมีความผิดพลาดเกิดขึ้น OnMouseOut เมื่อเมาส์เลื่อนออกจากออบเจ็กต์นั้น OnReset เมื่อฟอร์มมีการสั่งยกเลิก

การใช้ Event Handler (OnAbort) < คำสั่ง HTML OnAbort = “โค้ด javascript”> รูปแบบ  

การใช้ Event Handler (OnBlur) การใช้ Event Handler (OnBlur) จะใช้เมื่อ ออบเจ็กต์ต่าง ๆ เกิดการสูญเสีย Focus มีการทำงานของ ฟอร์ม เช่น มีแบบฟอร์มที่ให้เลือกใส่ข้อมูล เช่น Check Box , Radio Botton การทำงานของ OnBlur จะทำงานเมื่อมีการคลิกในส่วนที่เป็นพื้นที่ว่างของฟอร์ม

การใช้ Event Handler (OnClick)  

แบบฝึกหัด หน่วยที่ 10 Objects and Event handling จงตอบคำถามต่อไปนี้ให้ครบถ้วน Event Handler มีความหมายว่าอย่างไร อธิบาย Event Handler(Onfocus) มีการทำงานอย่างไร Window Object มีความหมายว่าอย่างไร Properties ของ Window Object ใช้ในการ กำหนดอะไร จงเขียนโค๊ดให้คลิกปุ่มแล้วหน้าต่าง นั้นปิดทันที จงเขียนโค๊ดให้คลิกปุ่มแล้วไปเปิด Folder c: จงเขียนโค๊ดสั่งให้พิมพ์หน้าที่เปิดขณะนั้น