Was passiert, wenn ich zwei Ereignishandler für dasselbe Element an dasselbe Ereignis binde?
Beispielsweise:
var elem = $("...")
elem.click(...);
elem.click(...);
"Gewinnt" der letzte Handler oder werden beide Handler ausgeführt?
javascript
jquery
event-handling
Flybywire
quelle
quelle
jQuery('.btn').on('click',handlerClick);
ist.off
? Sagen wir einfach, er wird an verschiedenen Stellen aufgerufen, ohne dass dies tatsächlich der Fall ist.bind
Methode verwenden. Siehe dies für Details: learn.jquery.com/jquery-ui/widget-factory/…Angenommen, Sie haben zwei Handler, f und g , und möchten sicherstellen, dass sie in einer bekannten und festen Reihenfolge ausgeführt werden, und kapseln sie dann einfach:
Auf diese Weise gibt es (aus Sicht von jQuery) nur einen Handler, der f und g in der angegebenen Reihenfolge aufruft .
quelle
.bind () von jQuery wird in der Reihenfolge ausgelöst, in der es gebunden war :
Quelle: http://api.jquery.com/bind/
Da die anderen Funktionen von jQuery (z.
.click()
B.) Verknüpfungen sind.bind('click', handler)
, würde ich vermuten, dass sie auch in der Reihenfolge ausgelöst werden, in der sie gebunden sind.quelle
Sie sollten in der Lage sein, die Ereignisse mithilfe der Verkettung nacheinander auszuführen, z. B.:
Ich denke, der folgende Code macht dasselbe
Quelle: http://www.peachpit.com/articles/article.aspx?p=1371947&seqNum=3
TFM sagt auch:
quelle
When an event reaches an element, all handlers bound to that event type for the element are fired. If there are multiple handlers registered, they will always execute in the order in which they were bound. After all handlers have executed, the event continues along the normal event propagation path.
Beide Handler werden gerufen.
Möglicherweise denken Sie an eine Inline-Ereignisbindung (z. B.
"onclick=..."
), bei der ein großer Nachteil darin besteht, dass nur ein Handler für ein Ereignis festgelegt werden kann.jQuery entspricht dem DOM Level 2-Ereignisregistrierungsmodell :
quelle
Mit den beiden Methoden erfolgreich funktioniert: Stephan202s Kapselung und mehrere Ereignis-Listener. Ich habe 3 Suchregisterkarten. Definieren wir deren Eingabetext-IDs in einem Array:
Wenn sich der Inhalt von searchtab1 ändert, möchte ich searchtab2 und searchtab3 aktualisieren. Haben Sie es für die Kapselung so gemacht:
Mehrere Ereignis-Listener:
Ich mag beide Methoden, aber der Programmierer hat die Kapselung gewählt, jedoch haben auch mehrere Ereignis-Listener funktioniert. Wir haben Chrome verwendet, um es zu testen.
quelle
Es gibt eine Problemumgehung, um sicherzustellen, dass ein Handler nach dem anderen ausgeführt wird: Fügen Sie den zweiten Handler einem enthaltenden Element hinzu und lassen Sie das Ereignis in die Luft sprudeln. In dem an den Container angehängten Handler können Sie event.target anzeigen und etwas tun, wenn es das ist, an dem Sie interessiert sind.
Roh vielleicht, aber es sollte definitiv funktionieren.
quelle
jquery führt beide Handler aus, da mehrere Ereignishandler zulässig sind. Ich habe Beispielcode erstellt. Du kannst es versuchen
Demo
quelle