dynamisch generierte Schaltfläche, ungültige Formularsteuerung mit name = 'antwort'

Question

Ich habe ein Problem beim Anhängen eines Ereignisses an eine dynamisch generierte Schaltfläche. Aber nach einigen research behaupten die meisten Lösungen, dass dieser Fehler normalerweise von einer Formularsteuerung generiert wird. Doch in meinem Fall die Fehlermeldung „ungültige Formularsteuerung mit‚Antwort‘name =“ erzeugt wird und dann ausgelöst, wenn eine Taste i dynamisch generierten gedrückt wird:

$("#BoxInner").append($("<button id='dynamicButton' class='btn btn-success' onclick='clickEvent()'>"+ "Button"+"</button>")); 

Ich habe eine Schaltfläche, um eine bestehende div und Anruf angehängt eine Onclick-Funktion, die dieses Element entfernt werden, wenn es so geklickt wird:

function clickEvent() 
{ 
$(this).remove(); 
} 

Danach in Chrom ausgeführt wird diese Methode nur auf der ersten Taste funktioniert hinzugefügt. Nachdem die erste Schaltfläche wie erwartet entfernt wurde, wird der Fehler "clickEvent" generiert und bei jedem Klick wird eine Anzahl gezählt. Nach dem Lesen vieler Posts über den Fehler, der einem Formular zugeordnet wurde, bin ich unsicher, wie das Problem gelöst werden kann ist mit dem Formular in meinem HTML-Dokument völlig nicht verwandt, und das Festlegen des Formulars, um keine Überprüfung zu erfordern, löst das Problem mit der Eigenschaft "Novalidate" nicht. Beachten Sie jedoch, dass der Fehler nicht ausgelöst wird, wenn das angefügte onclick-Ereignis entfernt wird.

Jede Hilfe würde geschätzt :)

Answer 1

$("#BoxInner").append($("<button id='dynamicButton' class='btn btn-success' onclick='clickEvent(this)'>"+ "Button"+"</button>")); // pass this to clickEvent function 
 

 
function clickEvent(obj) 
 
{ 
 
    $(obj).remove(); // remove button like this 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<div id="BoxInner"></div>

Answer 2

Dies liegt daran, der Ereignis-Listener beim Laden der Seite erstellt wird.

Sie sollten es in Ihrem Beispiel

$(wrapper_that_always_exists).on('click', the_freshly_added_element, function() { 
    ... 
}); 

So wie diese etwas tun, so etwas wie

$('#BoxInner').on('click', '#dynamicButton', function() { 
    ... 
}); 

sein würde, wenn Sie dies tun, das BoxInner Element für alle Klicks auf ein beliebiges Element immer hören innen, anfänglich erstellt oder nicht, das hat die ID dynamicButton