Es wird erwartet, dass der Dateidialog nur png-Dateien akzeptiert. Aber accept="image/png"
funktioniert nicht mit Firefox. Wie kann ich es schaffen?
P.S. Es funktioniert in Chrome.
Offenbar gibt es ein Problem mit bestimmten Erweiterungstypen für Firefox. Sie können mehr über diesen Fehler hier lesen.
Das letzte Update zu diesem Fehler stammt von vor ein paar Monaten und scheint noch nicht gelöst zu sein. Im Moment würde ich eine serverseitige Dateiprüfung vorschlagen, oder zumindest können Sie JavaScript verwenden, um die Dateierweiterung zu überprüfen, bevor sie hochgeladen wird.
Wie andere Antworten beschreiben, unterstützt Firefox type="image/png"
noch nicht. Stattdessen ignoriert es das Attribut und wendet keinen Dateifilter an. Die Verwendung von type="image/*"
würde funktionieren, aber dann würde der Filter alle Bilddateien zulassen.
Die beste praktische Problemumgehung ist die Verwendung von JavaScript-Code, der nach der Dateinamenerweiterung sucht. Es beweist nicht wirklich etwas, aber fast 100% ige Sicherheit, PNG-Dateien haben Namen, die mit .png enden und andere Dateien nicht. Beispielcode (ersetzen Sie das unhöfliche alert
durch eine Funktion, die zu Ihrem UI-Design passt):
Der Nachteil ist, dass Firefox, wenn Scripting deaktiviert ist, jede Datei akzeptiert, auch wenn accept="image/*"
zumindest die Dateien auf Bilddateien beschränken würde. Das Deaktivieren von JavaScript ist jedoch wahrscheinlich selten genug, verglichen mit dem Problem des Browser-Sniffing, das benötigt wird, um verschiedene type
-Attribute an verschiedene Browser zu senden.
Sie sollten natürlich die Dateitypen auf dem Server überprüfen, bevor Sie etwas mit den Dateien machen, da jedes Filtern von Dateitypen versehentlich oder absichtlich umgangen werden kann -
Damit Firefox das accept-Attribut teilweise respektiert, können Sie diesen Code verwenden, der aus der Antwort von Jukka K. Korpela kopiert und modifiziert wurde (danke! +1), mit dem zusätzlichen Bonus, das Original-Attribut accept, nicht juts für PNGs zu respektieren. nicht nur eine Erweiterung.
%Vor%Sie können es wie folgt verwenden:
%Vor% Es funktioniert nicht mit Mime-Typen oder -Gruppen wie image/*
(es ignoriert sie einfach), sondern könnte modifiziert werden, um eine Liste von Erweiterungen für jeden Mime-Typ hinzuzufügen [wie% ce_de% an das Array anhängen .jpg,.jpeg
wenn es accept
darin findet]
Mozilla Doc hier lesen Zur Zeit unterstützen nicht alle Browser die spezielle Dateierweiterung, aber alle unterstützen einen Dateityp wie Bild / Video.
%Vor%Tags und Links javascript html html5 firefox