Heim > Artikel > Web-Frontend > HTML5-Typ=Datei-Datei-Upload-Funktion

HTML5-Typ=Datei-Datei-Upload-Funktion

小云云Original: 2018-02-05 10:19:103366Durchsuche

In diesem Artikel wird hauptsächlich die neue Funktion von HTML5 vorgestellt, die Datei-Upload-Funktion „type=file“. Freunde, die sie benötigen, können darauf verweisen.

1. Syntax

2. Attribute (die folgenden drei werden nur von HTML5 unterstützt Es besteht Kompatibilität (sexuelle Probleme)

(1) mehrere: Gibt an, ob der Benutzer mehrere Werte auswählen kann. Multiple kann nur mit type=file und type=email verwendet werden.

(2) akzeptieren: Der vom Server akzeptierte Dateityp, andernfalls wird er ignoriert.

Audio/* steht für Sounddateien. Nur HTML5 unterstützt
video/* steht für Videodateien. Wird nur in HTML5 unterstützt.
image/* stellt eine Bilddatei dar. Nur HTML5 unterstützt

(3) erforderlich: Dieses Attribut gibt an, dass der Benutzer einen Wert eingeben muss, bevor er das Formular absendet.

3. Informationen zu hochgeladenen Dateien abrufen

<!DOCTYPE html>
<html lang="zh">
    <head>
        <meta charset="UTF-8" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>file multiple</title>
    </head>
    <body>
        <input type="file" multiple="multiple" id="test">
        <p id=&#39;content&#39;></p>
        <script type="text/javascript">
            var test = document.getElementById('test');
            test.addEventListener('change', function() {
                var t_files = this.files;
                var str = '';
                for(var i = 0, len = t_files.length; i < len; i++) {
                    console.log(t_files[i]);
                    str += &#39;<a href="javascript:void(0)">' + t_files[i].name + '</a><br/>';
                };
                document.getElementById('content').innerHTML = str;
            }, false);
        </script>
    </body>
</html>

Verwandte Empfehlungen:

Ausführliche Erläuterung des HTML5-Beispiels für die Datei-Upload-Funktion „Typ=Datei“

Lösung für das langsame und festsitzende Problem der Eingabe von [Typ=Datei] beim Öffnen

jQuery fügt dynamisch den Implementierungscode von input type=file

hinzu

Das obige ist der detaillierte Inhalt vonHTML5-Typ=Datei-Datei-Upload-Funktion. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Vorheriger Artikel：Implementierungsmethode zum wiederholten Einblenden der Tastatur nach dem Klicken auf die Eingabe auf der mobilen H5-SeiteNächster Artikel：Implementierungsmethode zum wiederholten Einblenden der Tastatur nach dem Klicken auf die Eingabe auf der mobilen H5-Seite

In Verbindung stehende Artikel

Mehr sehen