3.1. เหตุการณ์เกิดขึ้นได้อย่างไร*
ในกรณีแรกผู้ใช้ทำการดำเนินการบางอย่างบนหน้าเว็บเช่นคลิกปุ่มเพื่อสร้างเหตุการณ์คลิก ในกรณีที่สองหากผู้ใช้ไม่ได้ดำเนินการบนหน้าเว็บอาจมีเหตุการณ์เกิดขึ้น ตัวอย่างเช่นเบราว์เซอร์ได้โหลดทั้งหน้าซึ่งจะสร้างเหตุการณ์การโหลดเสร็จสมบูรณ์ หลังจากเหตุการณ์ถูกสร้างขึ้นเบราว์เซอร์จะตรวจสอบว่าโหนดที่สร้างเหตุการณ์ได้ถูกผูกไว้กับรหัสการประมวลผลเหตุการณ์ที่สอดคล้องกันหรือไม่ ถ้าเป็นเช่นนั้นรหัสจะถูกเรียกให้จัดการ หากไม่เป็นเช่นนั้นโหนดพาเรนต์จะยังคงค้นหาขึ้นไปและไม่มีรหัสการประมวลผลเหตุการณ์ที่สอดคล้องกัน (ฟองเหตุการณ์)
3.2. รหัสการประมวลผลเหตุการณ์ที่มีผลผูกพัน **
1) ผูกรหัสการประมวลผลเหตุการณ์ไปยังแท็ก HTML
ตัวอย่างเช่น: <a id = "a1" href = "" onclick = "f1 ();"> คลิก </a>
2) ผูกรหัสการประมวลผลเหตุการณ์ไปยังโหนด DOM
var obj = document.getElementById ('A1'); obj.onclick = f1;
สังเกต:
. อย่าเพิ่ม "()" ถึง F1 การเพิ่ม "()" หมายความว่า F1 ถูกดำเนินการทันที
ข. สามารถใช้การผูกแถวฟังก์ชั่นที่ไม่ระบุชื่อได้
นั่นคือ: obj.onclick = function () {// รหัส -
ค. การเชื่อมโยงรหัสการประมวลผลเหตุการณ์กับโหนด DOM สามารถแยกรหัส JS โดยไม่ต้อง HTML ซึ่งสะดวกสำหรับการบำรุงรักษารหัส
d. หากคุณต้องการส่งผ่านพารามิเตอร์ไปยังฟังก์ชันที่ถูกผูกไว้ ฟังก์ชั่นที่ไม่ระบุชื่อสามารถแก้ไขได้
นั่นคือ: obj.onclick = function () {f (พารามิเตอร์); -
3) ใช้วิธีการผูกมัดของเบราว์เซอร์ (เข้าใจ)
เบราว์เซอร์ที่แตกต่างกันมีวิธีการผูกมัดที่เป็นเอกลักษณ์ของตัวเองและเนื่องจากพวกเขาไม่เข้ากันจึงพยายามใช้มันให้น้อยที่สุด
สคริปต์สคริปต์สามารถเขียนได้ใน <body>
เทียบเท่ากับรูปต่อไปนี้
จะเกิดอะไรขึ้นถ้าพารามิเตอร์ถูกส่งผ่าน? ใช้ฟังก์ชั่นที่ไม่ระบุชื่อ
[กรณี 3.1] รหัสการประมวลผลเหตุการณ์ที่มีผลผูกพันกับแท็ก HTML ด้านบนสุด **
3.3. วัตถุเหตุการณ์ ***
1) รับวัตถุเหตุการณ์
IE BROWSER: คุณสามารถใช้กิจกรรมโดยตรงเพื่อรับ
Firefox: คุณต้องเพิ่มเหตุการณ์พารามิเตอร์ลงในวิธีการ
โดยทั่วไปเพื่อให้เข้ากันได้กับ IE และ Firefox ให้เพิ่มเหตุการณ์พารามิเตอร์ในวิธีการ
2) บทบาทของวัตถุเหตุการณ์
. รับพิกัดของการคลิกเมาส์
event.clientx event.clienty
ข. รับแหล่งเหตุการณ์ (วัตถุที่สร้างเหตุการณ์)
Firefox: Event.target ได้รับ IE Browser: Event.srcelement Gets
3.4. ฟองสบู่ **
1) Event Bubble คืออะไร? เมื่อเหตุการณ์ถูกสร้างขึ้นโดยโหนดเหตุการณ์จะถูกอัปโหลดขึ้นไปตาม (ก่อนไปยังโหนดพาเรนต์ถ้าโหนดพาเรนต์มีโหนดพาเรนต์จากนั้นอัปโหลดขึ้นไป)
2) วิธีห้ามฟองสบู่? Event.cancelBubble = true;
2) ปรากฏการณ์ "Event Bubble" ปิดกล่องโต้ตอบ "คุณคลิกที่ลิงค์" และยังคงปรากฏขึ้นในกล่องโต้ตอบ "คุณคลิกที่ div"
【กรณี 3.4 】วัตถุเหตุการณ์ **
<html>
<!-วัตถุเหตุการณ์->
-
JS ใช้กิจกรรมที่ขับเคลื่อนด้วยเพื่อตอบสนองต่อการดำเนินงานของผู้ใช้
ตัวอย่างเช่นการดำเนินการที่ดำเนินการบนหน้าต่างเบราว์เซอร์หรือองค์ประกอบหน้าเว็บ (ปุ่ม, กล่องข้อความ ... ) ผ่านเมาส์หรือคีย์เรียกว่าเหตุการณ์ (เหตุการณ์)
การกระทำของชุดของโปรแกรมที่เกิดจากเมาส์หรือฮอตคีย์เรียกว่ากิจกรรมไดรฟ์
ตัวจัดการหรือฟังก์ชั่นใช้ในการจัดการเหตุการณ์ซึ่งเราเรียกว่าตัวจัดการเหตุการณ์ (ตัวจัดการเหตุการณ์)
-
การประมวลผลความเข้ากันได้ของเบราว์เซอร์
<script language = "javascript"> <!- ถ้า (window.xmlhttprequest) {// mozilla, safari, ie7, ie8 ถ้า (! window.activexobject) {// mozilla, Safari, แจ้งเตือน ('Mozilla, Safari'); } else {Alert ('IE7 .8'); }} else {Alert ('IE6'); } //-> </script>-------------------------------------------------------------------------------
เหตุการณ์ต้องใช้หลายวิธีคุณสามารถใช้และแยกออกได้
<อินพุต type = "button" value = "red" onclick = "mychange (นี่), sayhello ()"/>
<body onkeydown = "showkey (event)" onload = "abc ()" onunload = "abc2 ()">
บทความข้างต้นเกี่ยวกับวิธีการเข้ากันได้ของเบราว์เซอร์ของกลไกการขับเคลื่อนเหตุการณ์ JS คือเนื้อหาทั้งหมดที่ฉันแบ่งปันกับคุณ ฉันหวังว่าคุณจะให้ข้อมูลอ้างอิงและฉันหวังว่าคุณจะสนับสนุน wulin.com มากขึ้น