So implementieren Sie dynamische Datumsauswahlfunktionen für erstellte Elemente

Dynamische Datumsauswahl-Implementierung für erstellte Elemente

Problem:

Sie möchten dynamisch generierten Textfeldern eine Datumsauswahl hinzufügen . Die Verwendung des Codes:

$(".datepicker_recurring_start" ).datepicker();

aktiviert jedoch die Datumsauswahl nur für das erste Textfeld, obwohl alle Textfelder die Klasse „datepicker_recurring_start“ teilen.

Lösung:

Um diese Einschränkung zu überwinden, verwenden Sie den folgenden Code:

$('body').on('focus',".datepicker_recurring_start", function(){
    $(this).datepicker();
});

Erklärung:

Dieser Code nutzt die delegierte Ereignisbehandlung, die Ereignis-Listenern dies ermöglicht an übergeordnete Elemente angehängt und auf untergeordnete Elemente angewendet werden, die einem bestimmten Selektor entsprechen. In diesem Fall:

• 'body' ist das übergeordnete Element, an das der Ereignis-Listener angehängt ist.
• 'focus' ist das Ereignis, das die Callback-Funktion auslöst, wenn ein beliebiges Element in ' body' mit der Klasse „.datepicker_recurring_start“ erhält den Fokus.
• Innerhalb der Callback-Funktion $(this).datepicker(); Aktiviert die Datumsauswahlfunktion für das fokussierte Element (datepicker_recurring_start).

Durch die Verwendung der dynamischen Ereignisbindung können Sie sicherstellen, dass Datumsauswahlfunktionen jederzeit an alle dynamisch erstellten Elemente mit der Klasse „.datepicker_recurring_start“ angehängt werden Das Fokusereignis wird ausgelöst.

Das obige ist der detaillierte Inhalt vonSo implementieren Sie dynamische Datumsauswahlfunktionen für erstellte Elemente. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!