Untersuchung der Eingabetastenfunktion vom Typ „Datei“

<br />Beim Hochladen auf manchen Websites wird nach dem Klicken auf die Schaltfläche „Durchsuchen“ ein Dialogfeld [Datei auswählen] angezeigt. Oft müssen wir nur Bilddateien hochladen, dann werden im Popup-Dialogfeld [Datei auswählen] nur Dateien mit entsprechenden Bildformaten angezeigt und alle anderen Dateiformate werden herausgefiltert und nicht angezeigt.
Beispiel: http://www.youku.com/v1.0.0326/v/swf/up.swf
Dies ist die Video-Upload-Option von Youku, die die FLASH-Methode verwendet, um die Anzeige von Nicht-Videodateien zu verhindern.
FLASH ist in diesem Zusammenhang im Allgemeinen wie hier beschrieben.
importiere flash.net.FileReferenceList;
var fileRef:FileReferenceList = neue FileReferenceList();
var alleTypen:Array = [];
var browse type:Objekt = neues Objekt();
Browsing type.description = "Browsingtyp (*.mp3)";
Durchsuchen Sie Typ.Erweiterung = "*.mp3";
allTypes.push(Typ durchsuchen);
fileRef.browse(alleTypen);
Können wir für das <input type="File"> auf unserer Webseite auch ein Popup-Fenster implementieren, um den Dateityp einzuschränken?
Die aktuelle Lösung besteht darin, Benutzer durch Überwachung daran zu erinnern, dass das Format der hochgeladenen Datei falsch ist.
<Skript>
Funktion check(){
var Dateipfad=Pfad.Wert
Dateipfad=Dateipfad.Teilzeichenfolge(Dateipfad.letzterIndexvon('.') 1,Dateipfad.Länge)
wenn(Dateipfad != 'jpg' und Dateipfad != 'gif')
alert("Es können nur Bilder im JPG- oder GIF-Format hochgeladen werden")
}
</Skript>
<input type=file name=path onpropertychange="check()"> (Es können nur Bilder im JPG- oder GIF-Format hochgeladen werden)
<Skript>
Funktion ck(Objekt){wenn(Objekt.Wert.Länge>0){
var af="jpg,gif,png,zip,rar,txt,htm";
if(eval("with(obj.value)if(!/" af.split(",").join("|") "/ig.test(substring(lastIndexOf('.') 1,length)))1;")){alert("Erlaubte Dateitypen:\n" af);obj.createTextRange().execCommand('delete')};
}}
</Skript>
<form>
<Eingabetyp=Dateiname=Pfad onpropertychange="ck(this)"/></form>
Dieser Effekt ist jedoch offensichtlich nicht so gut wie das Benutzererlebnis von FLASH. Bei dieser Art des FLASH-Uploads ist besondere Vorsicht geboten.

<<: Beheben Sie das Problem, dass weder der Repository- noch der Tag-Name leer sind, nachdem Docker ein neues Image geladen hat.

>>: Detaillierte Erläuterung der DOM-Stileinstellungen in vier Reaktionskomponenten

Die Elementbaumsteuerung integriert ein Dropdown-Menü mit Symbolen (Baum+Dropdown+Eingabe)

Untersuchung der Eingabetastenfunktion vom Typ „Datei“

Die Elementbaumsteuerung integriert ein Dropdown-Menü mit Symbolen (Baum+Dropdown+Eingabe)

Detaillierte Erklärung der Set-Datenstruktur von JavaScript

MySQL 8.0.20 Installations- und Konfigurations-Tutorial unter Win10

Zusammenfassung der grundlegenden Kenntnisse zur MySql-Datenbank

Asynchrone JS ES6-Lösung

Vorteile und Probleme des XHTML CSS Website Designs

Detaillierte Schritte zur Installation von Docker 1.8 auf CentOS 7

jQuery-Plugin zum Erreichen einer Bildunterbrechung

Allgemeine Datumsvergleichs- und Berechnungsfunktionen in MySQL

Lassen Sie uns darüber sprechen, was das URL-Objekt von JavaScript ist

Artikel empfehlen

Vue verwendet v-model, um den gesamten Prozess der El-Paginierungskomponenten zu kapseln

MySQL8.0-Installationsprozess unter Centos7 in VMware Workstation16 und Navicat-Remoteverbindung

MySQL-Sortierung mittels Index-Scan

Verwendung des Linux-Befehls ls

Acht Regeln für effektive Webformulare

Tutorial zum Erstellen eines Kommentarfelds mit Emoticons mithilfe von HTML und CSS

Lösung für leere Seite nach Vue-Verpackung

Beispielcode zur Implementierung eines zufälligen Roll Callers in HTML

Detaillierte Erklärung zum Erstellen mehrerer Instanzen von MySQL 5.6 in einer CentOS7-Umgebung

Detaillierte Erläuterung des zeitgesteuerten Protokollschneidens von Nginx

Reines CSS zum Erreichen der Funktion „Klicken zum Erweitern und Lesen des Volltexts“

So konfigurieren Sie denselben Domänennamen für das Front- und Backend von Nginx

CentOS7-Netzwerkkonfiguration unter virtueller VMware-Maschine (Host für drahtlosen Internetzugang)

Unterscheiden Sie zwischen Nullwert und leerem Zeichen ('') in MySQL

So erstellen Sie DockerHub selbst