ในระหว่างกระบวนการพัฒนาส่วนหน้าเรามักจะพบปัญหาของการเพิ่มเหตุการณ์ในองค์ประกอบหน้า นอกจากนี้ยังมีวิธี JS หลายวิธีในการเพิ่มเหตุการณ์รวมถึงการเพิ่มลงในโครงสร้างหน้าโดยตรงและวิธีการตรวจสอบเหตุการณ์ JS บางอย่าง เนื่องจากแต่ละเบราว์เซอร์มีกลไกที่แตกต่างกันสำหรับการตรวจสอบเหตุการณ์ฟองสบู่ Event เบราว์เซอร์ LE มีฟองสบู่เหตุการณ์เท่านั้นและไม่มีกลไกการตรวจสอบเหตุการณ์และปัญหาความเข้ากันได้ของการฟังเหตุการณ์เป็นปัญหาที่ใหญ่ที่สุด:
1. เขียนวิธีการเหตุการณ์โดยตรงบนโครงสร้างหน้า
ฟังก์ชั่น EventFun () {//console.log( นี่); } <อินพุต type = "ปุ่ม" onclick = "EventFun ()" value = "ปุ่ม"/> // สิ่งนี้เกี่ยวข้องกับปัญหาของขอบเขตนี้ EventFun ยังเป็นฟังก์ชั่นระดับโลกที่นี่ วัตถุคือ [หน้าต่างวัตถุ] และชี้ไปที่หน้าต่างในการแก้ปัญหาขอบเขตนี้คุณสามารถใช้วิธีการเพิ่มตัวแปรเหตุการณ์ไปยังฟังก์ชั่นส่วนกลางและส่งผ่านวัตถุนี้เป็นพารามิเตอร์ไปยังฟังก์ชันภายในโครงสร้างหน้า
<อินพุต type = "ปุ่ม" onclick = "EventFun2 (นี่)" value = "button2"/> ฟังก์ชั่น EventFun2 (eve) {// ที่นี่วัตถุเหตุการณ์ถูกส่งผ่านเป็นพารามิเตอร์ไปยังวิธีการทั่วโลก eve.name = "Alex"; window.name = "Robin"; console.log (นี่); // [หน้าต่างวัตถุ] console.log (eve); // [object htmlinputelement] console.log (this.name); // robin console.log (eve.name); // alexvar self = eve; console.log (this.name); // robin console.log (self.name); // Alex Alert (window.name); การแจ้งเตือน (self.name); -2. การใช้วิธีการกำหนดค่าให้กับแอตทริบิวต์เหตุการณ์เป็นวิธีการเชื่อมโยงกับเหตุการณ์ แต่ข้อ จำกัด ของวิธีนี้คือมันสามารถผูกเดียวกับวิธีเดียวกับเหตุการณ์ หากการผูกหลายครั้งถูกผูกไว้หนึ่งวิธีจะเหนือกว่า
htmlelementObject.onclick = fucntion () {// ใช้วิธีนี้เพื่อกำหนดค่าให้กับแอตทริบิวต์เหตุการณ์ตัวชี้นี้จะชี้ไปที่วัตถุหน้าต่างไม่ใช่วัตถุเหตุการณ์ดังนั้นวิธีนี้จึงเป็นข้อมูลอ้างอิง
// js รหัส fun1 (); fun2 (); fun3 (); console.log (นี่); // window.Object} ฟังก์ชั่น dosomething () {// js รหัส} htmlelementObject.onclick = dosomething; // ใช้รูปแบบของการกำหนดค่านี้ให้กับแอตทริบิวต์วัตถุเหตุการณ์3. การแพร่กระจายของเหตุการณ์ - ฟองและการจับภาพ
มาตรฐานเหตุการณ์ DOM กำหนดกระแสเหตุการณ์สองรายการซึ่งแตกต่างกันอย่างมีนัยสำคัญและอาจมีผลกระทบอย่างมากต่อแอปพลิเคชันของคุณ สตรีมเหตุการณ์ทั้งสองนี้ถูกจับและฟองสบู่ เช่นเดียวกับเทคโนโลยีเว็บมากมาย NetScape และ Microsoft นำไปใช้แตกต่างกันก่อนที่จะกลายเป็นมาตรฐาน NetScape เลือกที่จะใช้สตรีมเหตุการณ์การจับภาพในขณะที่ Microsoft ใช้สตรีมเหตุการณ์ Bubble โชคดีที่ W3C ตัดสินใจใช้ทั้งสองวิธีร่วมกันและเบราว์เซอร์ใหม่ส่วนใหญ่ทำตามวิธีการสตรีมสองเหตุการณ์นี้
โดยค่าเริ่มต้นเหตุการณ์จะใช้สตรีมเหตุการณ์ฟองและไม่มีการใช้สตรีมเหตุการณ์การจับภาพ อย่างไรก็ตามใน Firefox และ Safari คุณสามารถระบุการใช้สตรีมเหตุการณ์การจับภาพได้อย่างชัดเจนโดยผ่านพารามิเตอร์ USEcapture เมื่อลงทะเบียนเหตุการณ์และตั้งค่าพารามิเตอร์นี้เป็น TRUE
สตรีมเหตุการณ์ฟองสบู่
เมื่อเหตุการณ์ถูกทริกเกอร์ในองค์ประกอบ DOM ตัวอย่างเช่นผู้ใช้จะคลิกเมาส์บนโหนดชื่อไคลเอนต์เหตุการณ์จะเป็นไปตามโหนดพาเรนต์ต่างๆที่สืบทอดมาจากการที่โหนดฟองผ่านลำดับชั้นของโหนด DOM ทั้งหมดจนกว่าจะพบโหนดที่ติดอยู่กับโปรเซสเซอร์ประเภทเหตุการณ์ ในเวลานี้เหตุการณ์คือเหตุการณ์ onclick การเดือดดาลของเหตุการณ์สามารถยกเลิกได้ตลอดเวลาในระหว่างกระบวนการเดือด ในเบราว์เซอร์ที่สอดคล้องกับมาตรฐาน W3C คุณสามารถโทรหาวิธี stoppropagation () บนวัตถุเหตุการณ์และใน Internet Explorer คุณสามารถตั้งค่าแอตทริบิวต์ CancelBubble ของวัตถุเหตุการณ์เป็นจริง หากเหตุการณ์ไม่หยุดเหตุการณ์เหตุการณ์จะเกิดขึ้นผ่าน DOM จนกว่าจะถึงรูทเอกสาร
จับภาพเหตุการณ์
การประมวลผลของเหตุการณ์เริ่มต้นที่รากของระดับ DOM แทนที่จะมาจากองค์ประกอบเป้าหมายที่ก่อให้เกิดเหตุการณ์และเหตุการณ์จะถูกส่งผ่านตามลำดับจากองค์ประกอบบรรพบุรุษทั้งหมดขององค์ประกอบเป้าหมาย ในกระบวนการนี้เหตุการณ์จะถูกจับโดยองค์ประกอบที่ได้รับมาต่าง ๆ จากรูทเอกสารไปยังองค์ประกอบเป้าหมายเหตุการณ์ หากผู้ฟังเหตุการณ์ตั้งค่าแอตทริบิวต์ usecapture เป็น TRUE เมื่อลงทะเบียนพวกเขาสามารถกำหนดให้กับองค์ประกอบใด ๆ ในช่วงเวลานี้เพื่อจัดการเหตุการณ์ มิฉะนั้นเหตุการณ์จะถูกส่งผ่านไปยังองค์ประกอบถัดไปบนเส้นทางองค์ประกอบที่ได้รับจนกว่าองค์ประกอบเป้าหมาย หลังจากเหตุการณ์มาถึงองค์ประกอบเป้าหมายมันจะฟองผ่านโหนด DOM
วิธีการผูกมัดเหตุการณ์ที่ทันสมัย
สำหรับบทเรียนก่อนหน้านี้การใช้การเชื่อมเหตุการณ์แบบดั้งเดิมมีข้อเสียมากมายเช่นการไม่สามารถลงทะเบียนตัวจัดการเหตุการณ์หลายตัวในเหตุการณ์เดียวกันของวัตถุ และเบราว์เซอร์และ W3C ไม่ได้พิจารณาเรื่องนี้ดังนั้นในเบราว์เซอร์สมัยใหม่พวกเขามีวิธีการของตัวเองในการผูกเหตุการณ์
W3C DOM
obj.addeventListener (Evtype, FN, usecapture) - W3C จัดเตรียมวิธีการเพิ่มฟังก์ชั่นการจัดการเหตุการณ์ OBJ เป็นวัตถุที่จะเพิ่มเหตุการณ์ Evtype เป็นประเภทเหตุการณ์โดยไม่ต้องใช้คำนำหน้า FN เป็นฟังก์ชันตัวจัดการเหตุการณ์หาก usecapture เป็นจริงฟังก์ชันตัวจัดการเหตุการณ์จะถูกดำเนินการในขั้นตอนการจับ
obj.removeeVentListener (Evtype, FN, USEcapture)-W3C ให้วิธีการลบฟังก์ชั่นการจัดการเหตุการณ์
วิธี Microsoft IE
OBJ.ATTACHEVENT (EVTYPE, FN) - วิธีการที่จัดทำโดย IE เพื่อเพิ่มฟังก์ชั่นการจัดการเหตุการณ์ OBJ เป็นวัตถุที่จะเพิ่มเหตุการณ์ Evtype เป็นประเภทเหตุการณ์โดยมีคำนำหน้า, FN คือฟังก์ชั่นตัวจัดการเหตุการณ์เช่นไม่สนับสนุนการจับเหตุการณ์
obj.detachevent (Evtype, FN,) - IE ให้วิธีการลบฟังก์ชั่นการจัดการเหตุการณ์ Evtype มีอยู่บนคำนำหน้า
วิธีการรวมทั้งสองอย่าง
ฟังก์ชั่น addevent (obj, evtype, fn, usecapture) {ถ้า (obj.addeventListener) {obj.addeventListener (Evtype, fn, usecapture); } else {obj.attachevent ("on"+evtype, fn); // ie ไม่สนับสนุนการจับเหตุการณ์} else {obj ["on"+evtype] = fn; // ในความเป็นจริงสถานการณ์นี้จะไม่มีอยู่ obj.removeeVentListener (Evtype, FN, usecapture); } else {obj.detachevent ("on"+evtype, fn); } else {obj ["on"+evtype] = null; -มีปัญหากับวิธีการแนบ IE ซึ่งก็คือเมื่อใช้ attaineVent จุดนี้ไปที่หน้าต่างไม่ใช่ OBJ! แน่นอนว่ามีวิธีแก้ปัญหานี้!
แต่มีปัญหาอีกอย่างหนึ่งเกี่ยวกับวิธีการแนบของ IE ฟังก์ชั่นเดียวกันสามารถลงทะเบียนกับวัตถุเดียวกันและเหตุการณ์เดียวกันหลายครั้ง วิธีแก้ปัญหา: ละทิ้งวิธีการแนบของ IE! วิธีการที่แนบมาภายใต้ IE ไม่รองรับการจับภาพซึ่งไม่แตกต่างจากการลงทะเบียนเหตุการณ์แบบดั้งเดิมมากนัก (ยกเว้นการเชื่อมโยงหลายตัวจัดการเหตุการณ์) และวิธีการแนบ EE ของ IE มีปัญหาการรั่วไหลของหน่วยความจำ!
AddEvent, DELEVENT Modern Version
<! doctype html public "-// w3c // dtd xhtml 1.0 transitional // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-ype" content = "ข้อความ/html; charset = utf-8" ขอบด้านล่าง: 1px Solid #efefefef;} < /style> </head> <body> <div id = "outele" style = "padding: 10px; border: 1px solid #b2b2b2; พื้นหลัง: #efefefefefef;"> <อินพุตประเภท = "ปุ่ม" onclick = "EventFun2 (นี่);" id = "button2" value = "button2" /> <br /> <อินพุต type = "ปุ่ม" id = "button3" value = "button3" /> <br /> <อินพุต type = "ปุ่ม" id = "button4" value = "button4" /> <br /> id = "1111"> <td> 111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 ID = "33333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333 id = "44444"> <TD> 4444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444 อีก44444444444444อีก4444444อีก4444444อีกsอีกฉันกำลังอีก 144444444444444444444444444444444444 อีก44444444444444444 GON 444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444444 <tr id = "5555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555555559 เขียนวิธี JS โดยตรงบนโครงสร้างหน้าคอนโซล log (นี่); // สิ่งนี้เกี่ยวข้องกับปัญหากับขอบเขตนี้ EventFun เป็นฟังก์ชั่นทั่วโลกวัตถุคือหน้าต่างและจุดนี้ไปยังหน้าต่างการแจ้งเตือน (นี่); } ฟังก์ชั่น EventFun2 (eve) {// ที่นี่ผ่านวัตถุเหตุการณ์เป็นพารามิเตอร์ไปยังวิธีการทั่วโลก eve.name = "Alex"; // window.name = "Robin"; console.log (นี่); // [หน้าต่างวัตถุ] console.log (eve); // [วัตถุ htmlinputelement] console.log (this.name); // robin console.log (eve.name); // alex var self = eve; console.log (this.name); // robin console.log (self.name); // Alex Alert (window.name); การแจ้งเตือน (self.name); } ฟังก์ชั่น EventFun3 () {// 1 เขียนวิธี JS โดยตรงบนโครงสร้างหน้าคอนโซล log (นี่); // สิ่งนี้เกี่ยวข้องกับปัญหาของขอบเขตนี้ EventFun เป็นฟังก์ชั่นทั่วโลกวัตถุคือหน้าต่างและชี้ไปที่ Window Console.log (this.id); การแจ้งเตือน (นี้); การแจ้งเตือน (นี้); การแจ้งเตือน (this.id); // var outeleobj = eventutil. $ ("outele"); // removeEvent (Outeleobj, "คลิก", EventFun3); } /* var eventUtil = {}; Eventutil. $ = function (id) {return document.getElementById (id); } eventutil.openmes = EventFun3; Eventutil.addEventHandle = ฟังก์ชั่น (EventTarget, EventType, EventHandle) {// กำหนดองค์ประกอบวัตถุประเภทเหตุการณ์สำหรับการฟังเหตุการณ์ฟังก์ชั่นเหตุการณ์ถ้า (EventTarget.attacheVent) {EventTarget.attAcheVent ("ON" } อื่นถ้า (EventTarget.addeVentListener) {EventTarget.addeVentListener (EventType, EventHandle, False)} else {EventTarget ["ON" + EventType] = NULL; - EventUt.DeleEventHandle = ฟังก์ชั่น (EventTarget, EventType, EventHandle) {// กำหนดองค์ประกอบวัตถุประเภทเหตุการณ์สำหรับการฟังเหตุการณ์ฟังก์ชั่นเหตุการณ์ถ้า (EventTarget.detacheVent) {Alert ("ON"+EventType); การแจ้งเตือน ("on"+eventhandle); EventTarget.detachevent ("ON"+EventType, EventHandle); } อื่นถ้า (EventTarget.RemoveEventListener) {EventTarget.RemoveEventListener (EventType, EventHandle, False)} else {EventTarget ["ON" + EventType] = null; }};*/ var eventUtil = {$: function (id) {return document.getElementById (id); }, but4fun: function () {console.log (นี่); this.addeventhandle (); }, EventFun3: function () {console.log (นี่); การแจ้งเตือน (นี้); Delevent (OBJ, Evtype, FN, usecapture); }} /*** ใช้ addEventListener, attainEvent สำหรับฟังก์ชั่นการฟัง addEvent (obj, evtype, fn, usecapture) {ถ้า (obj.addeventListener) {obj.addeventListener (Evtype, fn, usecapture); } อื่นถ้า (obj.attachevent) {obj.attachevent ("on"+evtype, function () {fn.call (obj);}); } else {obj ["on"+evtype] = fn; // ในความเป็นจริงสถานการณ์นี้จะไม่มีอยู่}} ฟังก์ชั่น delevent (obj, evtype, fn, usecapture) {ถ้า (obj.removeeVentListener) {obj.removeeVentListener } อื่นถ้า (obj.detachevent) {obj.detachevent ("on"+evtype, fn); } else {obj ["on"+evtype] = null; }} ฟังก์ชั่น addEvent (obj, evtype, fn, usecapture) {ถ้า (obj.addeventListener) {// ลำดับความสำคัญจะมอบให้กับโครงการลงทะเบียนเหตุการณ์ W3C OBJ.AddeventListener (Evtype, fn, !! usecapture); } else {// เมื่อไม่รองรับ addeventListener (เช่น) เนื่องจาก IE ไม่สนับสนุนการจับภาพในเวลาเดียวกันมันจะดีกว่าที่จะใช้เหตุการณ์แบบดั้งเดิมที่มีผลผูกพันถ้า (! fn .__ eventid) {fn .__ eventid = addevent. {obj .__ eventhandles = {};} // _ attribute EventHandles ใช้เพื่อบันทึกการอ้างอิงไปยังตัวจัดการเหตุการณ์ทั้งหมด // จำแนกตามประเภทเหตุการณ์ถ้า (! obj .__ eventhandles [evtype]) {// ในครั้งแรก if (obj ["on"+evtype]) {// ฟังก์ชั่นการจัดการเหตุการณ์ได้รับการลงทะเบียนในแบบดั้งเดิมมาก่อน (obj .__ eventhandles [evtype] [0] = obj ["on"+evtype]). eventid = 0; // เพิ่มลงใน 0 bits obj ["on"+evtype] = addevent.execeventhandles; // เมื่อเหตุการณ์เกิดขึ้น ExecEventHandles จะสำรวจตาราง obj .__ eventhandles [evtype] และดำเนินการฟังก์ชั่นในนั้น}}}} addevent .__ eventhandlescounter = 1; // counter, 0 บิต evt = evt || window.event; var fns = this .__ eventhandles [evt.type]; สำหรับ (var i ใน fns) {fns [i]. call (this); - /* ฟังก์ชั่น delevent (obj, evtype, fn, usecapture) {ถ้า (obj.removeeVentListener) {// ใช้วิธี W3C ก่อนเพื่อลบฟังก์ชั่นตัวจัดการเหตุการณ์ obj.removeeVentListener (Evtype, fn, !! usecapture); } else {ถ้า (obj .__ eventhandles) {var fns = obj .__ eventhandles [evtype]; if (fns) {ลบ fns [fn .__ eventId];}}}}} ฟังก์ชั่น fixeVent (evt) {// ฟังก์ชั่น fixevent ไม่ได้ดำเนินการแยกกัน มันจะต้องมีพารามิเตอร์วัตถุเหตุการณ์และมันจะถูกดำเนินการเฉพาะเมื่อเหตุการณ์เกิดขึ้น! วิธีที่ดีที่สุดคือการรวมเข้ากับ ExecEventHandles ของฟังก์ชั่น addEvent ถ้า (! evt.target) {evt.target = evt.srcelement; evt.preventDefault = fixeVent.PreventDefault; evt.stoppropagation = fixeVent.stoppropagation; if (evt.type == "mouseover") {evt.relatedTarget = evt.fromelement; } อื่นถ้า (evt.type == "mouseout") {evt.RelatedTarget = evt.toElement; } evt.charcode = (evt.type == "keypress")? evt.keycode: 0; evt.eventphase = 2; // ie ทำงานเฉพาะในเวทีฟอง evt.timestamp = (วันที่ใหม่ ()). getTime (); // ตั้งค่าเป็นเวลาปัจจุบัน} return evt; } fixeVent.preventDefault = function () {this.returnValue = false; // ที่นี่ชี้ไปที่วัตถุเหตุการณ์บางอย่างไม่ใช่ fixeVent}; fixeVent.stopPropagation = function () {this.cancelBubble = true; };*///console.log(eventutil.$("button3")))-//return แอตทริบิวต์วัตถุของฟังก์ชัน Eventutil //eventutil.$("button3").onclick= EventFun; // 2 ใช้วิธีการกำหนดค่าให้กับแอตทริบิวต์เหตุการณ์วัตถุเพื่อตระหนักถึงการฟังเหตุการณ์ //eventutil.$("button3").onclick= EventFun2; // เมื่อเพิ่มหลายวิธีลงในแอตทริบิวต์เหตุการณ์หลังคือ //eventutil.$ = function () {function getById (id) {return document.getElementById (id); - // เขียนโดย Dean Edwards, 2005 // ด้วยการป้อนข้อมูลจาก Tino Zijdel, Matthias Miller, Diego Perini // http://dean.edwards.name/weblog/2005/10/add-event/ addevent (องค์ประกอบ, ประเภท, handler) {ถ้า (องค์ประกอบ } else {// กำหนดตัวจัดการเหตุการณ์แต่ละรายการ A ID ที่ไม่ซ้ำกันถ้า (! Handler. $$ GUID) Handler. $$ GUID = ADDEVENT.GUID ++; // สร้างตารางแฮชประเภทของเหตุการณ์สำหรับองค์ประกอบถ้า (! element.events) element.events = {}; // สร้างตารางแฮชของตัวจัดการเหตุการณ์สำหรับแต่ละองค์ประกอบ/เหตุการณ์คู่ handlers var = element.events [type]; if (! handlers) {handlers = element.events [type] = {}; // จัดเก็บตัวจัดการเหตุการณ์ที่มีอยู่ (ถ้ามีหนึ่ง) ถ้า (องค์ประกอบ ["on" + type]) {handlers [0] = องค์ประกอบ ["on" + type]; }} // จัดเก็บตัวจัดการเหตุการณ์ในตัวจัดการตารางแฮช [Handler. $$ GUID] = Handler; // กำหนดตัวจัดการเหตุการณ์ทั่วโลกเพื่อทำองค์ประกอบการทำงานทั้งหมด ["on" + type] = handleEvent; - // ตัวนับที่ใช้ในการสร้าง IDs addevent.guid = 1; ฟังก์ชั่น remverevent (องค์ประกอบ, ประเภท, ตัวจัดการ) {ถ้า (element.removeeVentListener) {element.removeEventListener (ประเภท, handler, false); } else {// ลบตัวจัดการเหตุการณ์ออกจากตารางแฮชถ้า (element.events && element.events [type]) {ลบ Element.events [type] [Handler. $$ GUID]; - Function HandleEvent (เหตุการณ์) {var returnValue = true; // คว้าวัตถุเหตุการณ์ (เช่นใช้วัตถุเหตุการณ์ทั่วโลก) เหตุการณ์ = เหตุการณ์ || FixeVent (((this.OwnerDocument || this.document || สิ่งนี้) .parentWindow || หน้าต่าง) .event); // รับการอ้างอิงไปยังตารางแฮชของตัวจัดการเหตุการณ์ var handlers = this.events [event.type]; // ดำเนินการตัวจัดการเหตุการณ์แต่ละตัวสำหรับ (var i ในตัวจัดการ) {this. $$ handlevent = handlers [i]; if (this. $$ handleEvent (เหตุการณ์) === false) {returnValue = false; }} returnValue; - ฟังก์ชั่น fixeVent (เหตุการณ์) {// เพิ่มวิธีการกิจกรรมมาตรฐาน W3C Event.PreventDefault = FixeVent.PreventDefault; Event.stopPropagation = fixeVent.stopPropagation; เหตุการณ์กลับ; - fixeVent.preventDefault = function () {this.ReturnValue = false; - fixeVent.stopPropagation = function () {this.cancelBubble = true; - ฟังก์ชั่น tableaddevent () {}; return {add: addEvent, ลบ: removeEvent, $: getById}} (); var outeleobj = eventutil. $ ("outele"); //addevent.apply(eventutil, [outleeleobj,"click ", eventfun3]); //eventutil.add(Outeleobj,"Click",.eventFun3); var inputobj = eventutil. $ ("button4"); var tableele = eventutil. $ ("htmleletable"); var tabtrele = tableele.getElementsByTagname ("tr"); Eventutil.add (Tableele, "คลิก", EventFun3); สำหรับ (i = 0; i <tabtrele.length; i ++) {eventutil.add (tabtrele [i], "คลิก", EventFun3); } eventutil.remove (Tableele, "คลิก", EventFun3); // วิธีการลบเหตุการณ์ Eventutil.add (Tableele, "คลิก", EventFun3); // eventutil.add (inputobj, "คลิก", EventFun3); //eventutil.remove(OuteleObj,"Click",.eventFun3); //console.log( Addevent); // addevent (inputobj, "คลิก", eventfun3, true); // Delevent (Outeleobj, "คลิก", EventFun3, False); </script> </body> </html>PS: ที่นี่เราให้บริการเครื่องมือออนไลน์เกี่ยวกับเหตุการณ์ JS ซึ่งสรุปประเภทเหตุการณ์ที่ใช้กันทั่วไปและฟังก์ชั่นฟังก์ชั่นของ JS:
รายการเหตุการณ์และฟังก์ชั่น JavaScript ทั้งหมด:
http://tools.vevb.com/table/javascript_event