Ich habe ein kleines Skript mit einigen Funktionen der HTML5-Datei erstellt, mit dem Sie eine oder mehrere Dateien auswählen können und jedes Mal den Namen der Datei (en) schreiben. Alles funktioniert so, wie es sollte, nur das Ereignis, um die Wertänderung der eingegebenen Dateien nur einmal zu erkennen, wie kann ich also jede Änderung und nicht nur bei der ersten Änderung auslösen?
Übrigens, hier ist, was ich gemacht habe: Ссылка
Offenbar wird der change -Ereignislistener entfernt, weil Sie innerHTML verwenden, um dasselbe Element ( wrapper ) zu aktualisieren, in dem sich die Eingabe selbst befindet. So wird der Inhalt des Elements wrapper - einschließlich der Dateieingabe - neu gerendert, und auf dem Weg wird der Ereignis-Listener entfernt (oder vielmehr ist er mit einem Element verbunden, das nicht mehr vorhanden ist).
Hier ist eine einfache jsfiddle , die genauso wie Ihr Code funktioniert, außer dass sie die ausgewählten Dateinamen in einem anderen Element als das Element, in dem die Eingabe ist. Und es funktioniert (in WebKit sowieso)
Hier ist ein weiterer Beweis (Ich habe im Grunde Ihren Code kopiert und nur eine Zeile hinzugefügt, um den Event-Listener nach der Änderung erneut zu registrieren wrapper.innerHTML )
Das change -Ereignis wird also für jede Änderung ausgelöst, aber die beobachtete Eingabe wird durch Verwendung von innerHTML im übergeordneten Element der Eingabe entfernt.
Ich weiß ehrlich gesagt nicht, ob das ein legitimer Browser-Bug ist oder nicht. Es macht Sinn, wenn innerHTML das vorhandene Eingabeelement "überschreibt", aber der Browser ist schlau genug, um den Wert der Eingabe nicht zurückzusetzen, also könnte man meinen, dass die Zuhörer auch dabei bleiben ... also ... nun, es ist verwirrend
Anstelle der Verwendung von onchange für ein Eingabeereignis
%Vor%
Keines der oben genannten Dinge funktionierte für mich, ich musste jedes Mal, wenn es geändert wurde, ein neues "Dummy" -Datei-Eingabefeld erstellen, was mir erlaubte, das Änderungsereignis erneut zu erfassen.
Der Prozess für mich war:
OnChange - Dateieingabe in ein anderes Element verschieben - Erstellen Sie eine neue Dateieingabe, um das Änderungsereignis erneut zu erfassen
addEventListener funktioniert nicht für IE8 (Ich bin nicht sicher, ab IE9). Wir müssen attachEvent listeiner verwenden. Wenn Sie Cross-Browser-Unterstützung benötigen, verwenden Sie diese
%Vor%ok gut nach @Flambino die Eingabe wird neu gerendert. Aus irgendeinem Grund ist das für mich irrelevant. Die Funktion $ .on ('change', callback) ist verloren.
Probieren Sie die .delegate-Funktion aus, die ich absolut liebe! Ссылка
Ok, also Delegate ist genau das gleiche, es sagt nur jquery, wenn es ein Element gibt, das auf dem Bildschirm mit einem bestimmten Handle gerendert wird, fügen Sie eine Funktionalität hinzu.
Auch wenn das Element erneut gerendert wird, bleibt es weiterhin funktionsfähig.
%Vor%Sie können denken, das ist eine Wegwerffunktion & amp; sag was ist der Unterschied, aber das hat mir viel Zeit auf Projekte gespeichert.
Ich bin mir nicht sicher warum, aber keine der Antworten auf diese alte Frage ist so einfach. Hier ist der Weg, dies heute leicht zu machen ...
mit jquery ...
Das ist es, nachdem Sie den Wert auf etwas anderes als die Datei geändert haben, die beim nächsten Klicken auf die Dateiänderung ausgewählt wurde Ereignis wird ausgelöst.
Tags und Links javascript html5 javascript-events