Jquery-Funktionen arbeiten nicht auf dynamisch geladenen Inhalten (nicht bindende Funktion)

Question

Ich habe eine Frage in Javascript, dass ich ein Formular habe, das Hinzufügen und Löschen-Taste, beim Klicken sie einige der Formularfelder wiederholt und gelöscht wie per Schaltfläche klicken, in diesen Bereichen habe ich auch Datetime haben, und ich möchte, dass es auch in erzeugten Feldern arbeiten sollte, aber es funktioniert nicht, obwohl ich Klasse statt Id verwendet haben sie Funktionen wie

$(function() { 
    var now = new Date(); 
    $('.time_in').datetimepicker({ 
     defaultDate: now, 
     format: 'HH:mm' 
    }); 
}); 

für das geben aber es funktioniert nur im ersten Feld statt aller Felder, Ich habe auch einige Event-Handler nach dem Ändern der Werte von datetimepicker angeschlossen, aber ich habe keine Probleme mit ihnen, ich weiß, wie es geht .

Ich wollte nur fragen, dass, wie Funktion zu geben oder Felder mit initialisieren .. Datetime

Unten ist der Screenshot

Scenario

Answer 1

Hallo, da Sie Textfelder dynamisch sollten Sie Ereignis Delegation erstellen Verwenden Sie die Methode on() von jQuery (erfordert jQuery Version 1.7x +).

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

hier hinzufügen ist eine kleine Demo http://jsfiddle.net/SJ7bJ/1013/

Answer 2

Sie müssen den Code aufzurufen das Datetimepicker auf jedem Feld hinzuzufügen, nachdem Sie die neuen Elemente hinzugefügt haben. Erwägen Sie, den Code neu zu strukturieren, um den Datepimepicker in eine separate Funktion einzuordnen, die von der Funktion init und von der Funktion #add aufgerufen werden kann.

$(function() { 
    add_time_in_datetimepicker(); 
}); 

function add_time_in_datetimepicker() { 
    var now = new Date(); 
    $('.time_in').datetimepicker({ 
     defaultDate: now, 
     format: 'HH:mm' 
    }); 
}); 

Und dann am Ende der Funktion #add den gleichen Anruf machen. Sie müssen dies für alle datetimepicker-Klassen tun, die Sie dynamisch hinzufügen möchten.