บทความนี้สรุปเหตุการณ์ทั่วไปของ JS DOM สำหรับทุกคน ซึ่งมีค่าอ้างอิงที่แน่นอน เพื่อน ๆ ที่สนใจสามารถอ้างอิงถึงได้
คลิก คลิก dblคลิก ดับเบิลคลิก เมนูบริบท คลิกขวา เมาส์อยู่เหนือองค์ประกอบ แนะนำให้ใช้ mouseenter แทนการเลื่อนเมาส์ออก เมื่อเมาส์ออกจากองค์ประกอบ แนะนำให้ใช้ mouseleave แทน mouseenter เมาส์จะโฉบอยู่เหนือองค์ประกอบ mouseleave เมาส์ออกจากองค์ประกอบ mousedown ปุ่มเมาส์กด mouseup ปุ่มเมาส์ยก mousemove การเคลื่อนไหวของเมาส์
keydown ปุ่มคีย์บอร์ดกด keyup คีย์บอร์ดปุ่มยก keypress ปุ่มคีย์บอร์ดกดใช้ในการป้อนตัวอักษรคีย์
1. องค์ประกอบใด ฟังเหตุการณ์คีย์บอร์ดได้ไหม?
1 เอกสาร
2 องค์ประกอบที่สามารถโฟกัสได้ (ส่วนควบคุมแบบฟอร์ม โดยเฉพาะองค์ประกอบอินพุต)
2. อะไรคือความแตกต่างระหว่างการกดปุ่มลงและการกดปุ่ม?
① การกดแป้นสามารถทริกเกอร์ได้โดยการกดปุ่มทั้งหมด และไม่สามารถแยกความแตกต่างระหว่างแป้นตัวพิมพ์ใหญ่และตัวพิมพ์เล็กได้
กดปุ่ม 2 จะสามารถทริกเกอร์ได้เมื่อมีการกดปุ่มที่สามารถป้อนอักขระได้เท่านั้น และปุ่มต่างๆ สามารถคำนึงถึงตัวพิมพ์เล็กและตัวพิมพ์ใหญ่ได้
3. จะทราบได้อย่างไรว่ากดปุ่มไหน?
ใช้แอตทริบิวต์ในออบเจ็กต์เหตุการณ์:
evnet.keyCode รับค่า ASCII ที่สอดคล้องกับ
เหตุการณ์คีย์ซึ่งเหมือนกับ keyCode
event.key รับค่าอักขระของคีย์
จะถูกทริกเกอร์เมื่อทุกอย่างในเพจถูกโหลด คุณสามารถฟังหน้าต่างหรือองค์ประกอบเนื้อหาได้ DOMContentLoaded จะถูกทริกเกอร์เมื่อมีการโหลดองค์ประกอบทั้งหมดในเพจ สามารถใช้ addEventListener เพื่อฟังเหตุการณ์ beforeunload เท่านั้น ความแตกต่างระหว่างเหตุการณ์โหลดและเหตุการณ์ DOMContentLoaded ที่จะถูกทริกเกอร์เมื่อปิดหน้าเว็บ
:
1 เหตุการณ์การโหลดจะถูกทริกเกอร์หลังจากโหลดทุกอย่างในเพจแล้วเท่านั้น รวมถึงองค์ประกอบและภายนอก ทรัพยากร.
2) เหตุการณ์ DOMContentLoaded สามารถทริกเกอร์ได้เมื่อมีการโหลดองค์ประกอบทั้งหมดในหน้า ยกเว้นทรัพยากรภายนอก
จะถูกทริกเกอร์เมื่อมีการส่งแบบฟอร์ม เหตุการณ์นี้รับฟังองค์ประกอบแบบฟอร์ม รีเซ็ตจะถูกทริกเกอร์เมื่อรีเซ็ตแบบฟอร์ม เหตุการณ์นี้จะฟังองค์ประกอบแบบฟอร์ม จะถูกทริกเกอร์เมื่อตัวควบคุมแบบฟอร์มได้รับโฟกัส เมื่อตัวควบคุมแบบฟอร์มสูญเสียโฟกัส การเปลี่ยนแปลง สำหรับกล่องอินพุต มันจะถูกทริกเกอร์เมื่อเนื้อหาเปลี่ยนแปลงและโฟกัสหายไป เหมาะสำหรับการเลือก
การโหลดไฟล์รูปภาพ เสร็จสมบูรณ์ ข้อผิดพลาดในการโหลดรูปภาพล้มเหลว
ปรับขนาดตรวจสอบหน้าต่างและการเลื่อนขนาดวิวพอร์ต ตรวจสอบหน้าต่างหรือองค์ประกอบที่มีเนื้อหาการเลื่อน ซึ่งทริกเกอร์เมื่อมีการเลื่อนเนื้อหาในหน้าหรือองค์ประกอบ
ตั้งค่าพารามิเตอร์อย่างเป็นทางการตัวแรกให้กับฟังก์ชันการเรียกกลับของเหตุการณ์เพื่อรับออบเจ็กต์เหตุการณ์
เหตุการณ์ประเภทต่างๆ จะได้รับออบเจ็กต์เหตุการณ์ประเภทต่างๆ
offsetX / offsetY รับตำแหน่งพิกัดของเมาส์บนองค์ประกอบเป้าหมาย clientX / clientY รับตำแหน่งพิกัดของเมาส์บนวิวพอร์ต pageX / pageY รับตำแหน่งพิกัดของเมาส์บนหน้า screenX / screenY รับตำแหน่งพิกัดของเมาส์บนหน้าจอ ปุ่มตำแหน่งพิกัดบนปุ่มรับว่าปุ่มเมาส์ใดถูกกด 0: ปุ่มซ้าย 1: ปุ่มกลาง 2: ปุ่มขวา
keyCode รับค่าโค้ดที่สอดคล้องกับปุ่มซึ่งเหมือนกับ keyCode key รับค่าอักขระที่สอดคล้องกับคีย์
รับชื่อเหตุการณ์ timeStamp รับจำนวนมิลลิวินาทีจากเวลาที่เหตุการณ์ถูกทริกเกอร์ เป้าหมาย รับองค์ประกอบเป้าหมาย stopPropagation() ป้องกันเหตุการณ์จากการเดือดปุด ๆ PreventDefault() บล็อกพฤติกรรมเริ่มต้นของเบราว์เซอร์
โดยการรัน event.stopPropagation() ในฟังก์ชันเรียกกลับของเหตุการณ์เพื่อป้องกันฟองเดือด
การคลิกที่ไฮเปอร์ลิงก์เพื่อส่งและรีเซ็ตแบบฟอร์มการข้าม คลิกขวาเพื่อแสดงเมนูระบบ ฯลฯ...
เรียก event.preventDefault() ในฟังก์ชันโทรกลับของเหตุการณ์เพื่อป้องกันพฤติกรรมเริ่มต้น
หมายเหตุ: หากคุณใช้วิธีที่สองเพื่อฟังเหตุการณ์
return falseในฟังก์ชันการโทรกลับยังสามารถป้องกันพฤติกรรมเริ่มต้นได้อีกด้วย
จะรับฟังองค์ประกอบระดับบน กำหนดองค์ประกอบเป้าหมาย และดำเนินการที่เกี่ยวข้องหากองค์ประกอบเป้าหมายตรงตามเงื่อนไข
ข้อดีของการมอบหมายเหตุการณ์:
สำหรับการฟังเหตุการณ์เดียวกันบนองค์ประกอบจำนวนมาก การใช้การมอบหมายเหตุการณ์จะมีประสิทธิภาพมากกว่าการข้ามและฟังทีละรายการ
การใช้การมอบหมายเหตุการณ์ช่วยให้องค์ประกอบใหม่ตอบสนองต่อเหตุการณ์ได้
คำแนะนำที่เกี่ยวข้อง: [วิดีโอสอน JavaScript]
ด้านบนนี้เป็นบทสรุปล่าสุดของเหตุการณ์ JavaScript DOM ทั่วไป! สำหรับรายละเอียดเพิ่มเติม โปรดอ่านบทความอื่นๆ ที่เกี่ยวข้องบนเว็บไซต์ php Chinese!
