Warum werden meine JavaScript-Ereignisse nach dem Anhängen neuer Elemente nicht ausgelöst?

JavaScript wird nach dem Anhängen nicht ausgelöst

Problemübersicht

Beim Hinzufügen neuer Eingabeelemente zu einer Webseite mithilfe von JavaScript werden nachfolgende Ereignisse möglicherweise nicht ausgelöst. Dies liegt daran, dass jQuery diese neu hinzugefügten Elemente nicht kennt.

Ereignisdelegierung und Bubbling

jQuery funktioniert durch die Registrierung von Ereignishandlern für bestimmte Elemente. Wenn jedoch neue Elemente dynamisch hinzugefügt werden, können diese Ereignishandler sie nicht erkennen. Um dieses Problem zu lösen, wird die Ereignisdelegierung verwendet.

Bei der Ereignisdelegierung wird auf Ereignisse in einem übergeordneten Element gewartet, das zum Zeitpunkt des Ladens von jQuery bereits im DOM vorhanden ist. Wenn ein Ereignis innerhalb eines verschachtelten untergeordneten Elements auftritt, wird es zum übergeordneten Element weitergeleitet, wo der Ereignishandler es erfassen kann.

Codelösung

Um die Ereignisdelegierung im bereitgestellten Code zu verwenden, muss der Ereignishandler für die Schaltflächen sollten so geändert werden, dass sie die Methode on() verwenden. Mit dieser Methode kann das Abhören von Ereignissen an ein übergeordnetes Element delegiert werden.

$(document).on('click', '.races', function(e) {
  // ... rest of the code
});

Durch die Verwendung von $(document).on() wird das Ereignis an das Dokumentobjekt delegiert, das währenddessen im DOM vorhanden ist Laden der Seite. Dadurch wird sichergestellt, dass Ereignisse von neu hinzugefügten .races-Elementen erfasst und vom Ereignishandler verarbeitet werden.

Das obige ist der detaillierte Inhalt vonWarum werden meine JavaScript-Ereignisse nach dem Anhängen neuer Elemente nicht ausgelöst?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!