Javascript bir hadisə tetiklemek üçün necə?

addEventListener istifadə edərək mətn sahəsinə hadisə əlavə addEventListener . Yaxşı işləyir. Mənim problemim başqa bir funksiyadan proqramlı olaraq bir hadisə yaratmaq istədim.

Bunu necə edə bilərəm?

441
22 марта '10 в 11:41 2010-03-22 11:41 KoolKabin 22 mart 'da 11:41' də soruşdu . 2010-03-22 11:41
@ 17 cavab

FireEvent'i IE 8 və ya daha aşağıda istifadə edə bilərsiniz və w3c dispatchEvent digər brauzerlərdə də istifadə edə bilər. createEvent istədiyiniz hadisə yaratmaq üçün brauzerdən asılı olaraq createEvent və ya createEvent istifadə edə bilərsiniz.

Burada element dataavailable hadisəni tetikleyen kodun (prototipdən) kodunun izahlı bir hissəsi:

  var event; // The custom event that will be created if (document.createEvent) { event = document.createEvent("HTMLEvents"); event.initEvent("dataavailable", true, true); } else { event = document.createEventObject(); event.eventType = "dataavailable"; } event.eventName = "dataavailable"; if (document.createEvent) { element.dispatchEvent(event); } else { element.fireEvent("on" + event.eventType, event); } 
412
22 марта '10 в 11:55 2010-03-22 11:55 Cavab Alsciende tərəfindən 22 Mart 'da 10: 55' də verildi. 2010-03-22 11:55

İş nümunəsi:

 // Add an event listener document.addEventListener("name-of-event", function(e) { console.log(e.detail); // Prints "Example of an event" }); // Create the event var event = new CustomEvent("name-of-event", { "detail": "Example of an event" }); // Dispatch/Trigger/Fire the event document.dispatchEvent(event); 
border=0

Köhnə polyfill brauzerlər və daha kompleks nümunələr üçün, MDN sənədlərinə baxın.

EventTarget.dispatchEventCustomEvent üçün dəstək masalarına baxın.

274
12 дек. Cavab Dorian 12 dekabr verilir. 2013-12-12 19:06 '13 at 19:06 2013-12-12 19:06

jQuery istifadə edirsinizsə, yalnız edə bilərsiniz

 $('#yourElement').trigger('customEventName', [arg0, arg1, ..., argN]); 

və idarə

 $('#yourElement').on('customEventName', function (objectEvent, [arg0, arg1, ..., argN]){ alert ("customEventName"); }); 

burada "[arg0, arg1, ..., argN]" bu arqumentlərin isteğe bağlı olduğunu ifadə edir.

37
06 июля '14 в 4:31 2014-07-06 04:31 Cavab Hilliant Vítor Lima Pereira tərəfindən 06 iyul 'da 4:31' də verildi 2014-07-06 04:31

IE9 + 'yı dəstəkləyərsə, aşağıdakılardan istifadə edə bilərsiniz. Eyni konsepsiyaya daxil olun jQuery'ye ehtiyac yoxdur .

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
23
Cavab cənabə verildi. 17 марта '16 в 17:09 2016-03-17 17:09 Polywhirl 17 mart '16, 17:09 2016-03-17 17:09

Javascript istifadə edərək, siçan hovering isə bir klik hadisə axtarır, siçan başlamaq və siçan hover. Juan Mendezin cavabını tapdım. Cavab üçün bura vurun.

Buraya basın - canlı bir demo və aşağıdakı kod:

 function fireEvent(node, eventName) { // Make sure we use the ownerDocument from the provided node to avoid cross-window problems var doc; if (node.ownerDocument) { doc = node.ownerDocument; } else if (node.nodeType == 9) { // the node may be the document itself, nodeType 9 = DOCUMENT_NODE doc = node; } else { throw new Error("Invalid node passed to fireEvent: " + node.id); } if (node.dispatchEvent) { // Gecko-style approach (now the standard) takes more work var eventClass = ""; // Different events have different event classes. // If this switch statement can't map an eventName to an eventClass, // the event firing is going to fail. switch (eventName) { case "click": // Dispatching of 'click' appears to not work correctly in Safari. Use 'mousedown' or 'mouseup' instead. case "mousedown": case "mouseup": eventClass = "MouseEvents"; break; case "focus": case "change": case "blur": case "select": eventClass = "HTMLEvents"; break; default: throw "fireEvent: Couldn't find an event class for event '" + eventName + "'."; break; } var event = doc.createEvent(eventClass); var bubbles = eventName == "change" ? false : true; event.initEvent(eventName, bubbles, true); // All events created as bubbling and cancelable. event.synthetic = true; // allow detection of synthetic events // The second parameter says go ahead with the default action node.dispatchEvent(event, true); } else if (node.fireEvent) { // IE-old school style var event = doc.createEventObject(); event.synthetic = true; // allow detection of synthetic events node.fireEvent("on" + eventName, event); } }; 
13
29 окт. Cavab 29 oktyabrda S. Mişra tərəfindən verilir . 2015-10-29 19:57 '15 at 19:57 2015-10-29 19:57

Əgər jQuery istifadə etmək istəmirsinizsə və xüsusən geriyə uyğunluq barədə qayğınına ehtiyacınız yoxdursa, istifadə edin

 let element = document.getElementById(id); element.dispatchEvent(new Event("change")); // or whatever the event type might be 

Buradaburadakı sənədlərə baxın.

12
29 мая '18 в 18:20 2018-05-29 18:20 cavab 29 may 1818- də saat 18: 201- dək emisilva tərəfindən verilir

Sadəcə bir dinləyici hadisə əl tetiklemek üçün ehtiyac tələb etməyən bir alternativ təklif:

Hadisən dinləyicinizin nə olursa olsun, bir funksiyaya keçin və bu funksiyanı hadisə dinləyicisindən çağırın.

Bundan sonra bu funksiyanı hər hansı bir yerə tetiklendikdə bir hadisə ilə eyni şeyi yerinə yetirmək üçün zəng edə bilərsiniz.

Mən daha az "sıx" və oxumaq daha asan tapa bilərsiniz.

8
15 апр. Apr 15-də Kirby L. Wallace tərəfindən verilmiş cavab 2016-04-15 23:49 '16 at 11:49 PM 2016-04-15 23:49

Yalnız aşağıdakıları istifadə etdim (daha asan görünür):

 element.blur(); element.focus(); 

Bu halda, hadisə yalnız dəyər, həqiqətən, istifadəçi tərəfindən itirilmiş normal fokus lokusundan istifadə edərək zəng edəcəyiniz kimi dəyişildiyində tetiklenir.

6
07 янв. Aleksander Lech tərəfindən verilmiş cavab 07 Yan 2016-01-07 16:43 '16 at 16:43 2016-01-07 16:43

IE ilə işləmək üçün dəyişdirilmiş @Dorian cavab :

 document.addEventListener("my_event", function(e) { console.log(e.detail); }); var detail = 'Event fired'; try { // For modern browsers except IE: var event = new CustomEvent('my_event', {detail:detail}); } catch(err) { // If IE 11 (or 10 or 9...?) do it this way: // Create the event. var event = document.createEvent('Event'); // Define that the event name is 'build'. event.initEvent('my_event', true, true); event.detail = detail; } // Dispatch/Trigger/Fire the event document.dispatchEvent(event); 

Skripka: https://jsfiddle.net/z6zom9d0/1/

Həmçinin baxın:
https://caniuse.com/#feat=customevent

5
05 марта '18 в 22:00 2018-03-05 22:00 Yarin tərəfindən 05 mart 18.00-da saat 22.00-da verilən cavab 2018-03-05 22:00
 function fireMouseEvent(obj, evtName) { if (obj.dispatchEvent) { //var event = new Event(evtName); var event = document.createEvent("MouseEvents"); event.initMouseEvent(evtName, true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null); obj.dispatchEvent(event); } else if (obj.fireEvent) { event = document.createEventObject(); event.button = 1; obj.fireEvent("on" + evtName, event); obj.fireEvent(evtName); } else { obj[evtName](); } } var obj = document.getElementById("......"); fireMouseEvent(obj, "click"); 
4
02 июля '16 в 4:49 2016-07-02 04:49 cavab 02 iyul 16: 04-ə qədər verilir. 2016-07-02 04:49

Birlikdə qoyduğum bu xüsusiyyətdən istifadə edə bilərsiniz.

 if (!Element.prototype.trigger) { Element.prototype.trigger = function(event) { var ev; try { if (this.dispatchEvent  CustomEvent) { ev = new CustomEvent(event, {detail : event + ' fired!'}); this.dispatchEvent(ev); } else { throw "CustomEvent Not supported"; } } catch(e) { if (document.createEvent) { ev = document.createEvent('HTMLEvents'); ev.initEvent(event, true, true); this.dispatchEvent(event); } else { ev = document.createEventObject(); ev.eventType = event; this.fireEvent('on'+event.eventType, event); } } } } 

Aşağıdakı hadisəni başladın:

 var dest = document.querySelector('#mapbox-directions-destination-input'); dest.trigger('focus'); 

Hadisəni izləyin:

 dest.addEventListener('focus', function(e){ console.log(e); }); 

Bu kömək edir!

1
06 сент. Cavab verildi Moorexa 06 Sentyabr. 2018-09-06 19:00 '18 saat 19:00 'da 2018-09-06 19:00

Element metodunu istifadə edərək hadisə tetiklemek üçün aşağıdakı kodu istifadə edə bilərsiniz:

 if (!Element.prototype.triggerEvent) { Element.prototype.triggerEvent = function (eventName) { var event; if (document.createEvent) { event = document.createEvent("HTMLEvents"); event.initEvent(eventName, true, true); } else { event = document.createEventObject(); event.eventType = eventName; } event.eventName = eventName; if (document.createEvent) { this.dispatchEvent(event); } else { this.fireEvent("on" + event.eventType, event); } }; } 

 <input id="my_input" type="input" value="Hellow World"> <button id="my_button">Change Input</button> 
0
13 дек. Hemn Chawroka tərəfindən verilmiş cavab 13 dekabr 2018-12-13 22:13 '18 saat 10:13 'da 2018-12-13 22:13
 var btn = document.getElementById('btn-test'); var event = new Event(null); event.initEvent('beforeinstallprompt', true, true); btn.addEventListener('beforeinstallprompt', null, false); btn.dispatchEvent(event); 

Bu, əvvəlcədən quraşdırılmamış tədbirə dərhal tetikleyecektir.

0
26 мая '18 в 20:41 2018-05-26 20:41 cavab Dan Alboteanu 26 may '18 saat 20:41 2018-05-26 20:41 verilir

Ən effektiv üsul addEventListener ilə birbaşa qeydiyyata alınmış eyni funksiyanı addEventListener .

CustomEvent və co istifadə edərək saxta bir hadisə də tetikleyebilirsiniz.

Nəhayət, <input type="file"> kimi bəzi elementlər, .click() metodunu dəstəkləyir.

0
21 нояб. Cavab Walle Cyril tərəfindən verilir. 2017-11-21 01:50 '17 saat 01:50 2017-11-21 01:50

Jquery hadisə zəngini istifadə edin. Hər hansı bir elementin Çıxışını zəng etmək istədiyiniz yerdə yaz.

 $("#element_id").change(); 

element_id, çağırmaq istədikləri dəyişən elementin ididir.

İstifadən çəkinin

  element.fireEvent("onchange"); 

Çünki çox az dəstək var. Dəstək üçün bu sənədə baxın.

-1
20 февр. Cavab Bhuvan Arora tərəfindən verilir. 2018-02-20 13:39 '18 saat 13:39 'da 2018-02-20 13:39

HTML

 <a href="demoLink" id="myLink"> myLink </a> <button onclick="fireLink(event)"> Call My Link </button> 

Js

 // click event listener of the link element -------------- document.getElementById('myLink').addEventListener("click", callLink); function callLink(e) { // code to fire } // function invoked by the button element ---------------- function fireLink(event) { document.getElementById('myLink').click(); // script calls the "click" event of the link element } 
-1
14 сент. Cavab Pall Arpad tərəfindən verilir. 2018-09-14 00:07 '18 'də 0:07 2018-09-14 00:07' də

İstədiyiniz şey belədir:

 document.getElementByClassName("example").click(); 

JQuery istifadə edərək, belə bir şey olacaq:

 $(".example").trigger("click"); 
-11
30 марта '15 в 18:42 2015-03-30 18:42 cavab Osiris RD 30 mart '18 saat 18:42' də verilir

tags ilə bağlı digər suallar və ya sual