So erstellen Sie eine Schaltfläche in HTML, um eine Datei herunterzuladen

Autor: Judy Howell
Erstelldatum: 5 Juli 2021
Aktualisierungsdatum: 22 April 2024
Anonim
So erstellen Sie eine Schaltfläche in HTML, um eine Datei herunterzuladen - Artikel
So erstellen Sie eine Schaltfläche in HTML, um eine Datei herunterzuladen - Artikel

Inhalt

Webdesigner verwenden aus funktionalen und ästhetischen Gründen häufig in HTML-Dokumente eingebettete Schaltflächen. Die Schaltflächen bieten Benutzern nicht nur eine optisch ansprechende Möglichkeit zum Senden von Informationen oder zum Treffen von Entscheidungen, sondern bieten auch verschiedene Funktionen, die auf der Benutzerinteraktion basieren. In diesem Artikel ermöglicht eine HTML-Schaltfläche dem Benutzer das Herunterladen einer Datei, wenn auf diese geklickt wird.


Anweisungen

Schaltflächen sind nützliche und flexible HTML-Komponenten (Hemera Technologies / PhotoObjects.net / Getty Images)
  1. Erstellen Sie die HTML-Datei in einem Texteditor, z. B. Notepad. Die Basisdatei sollte mindestens die Tags "html" und "body" enthalten:

    >

    Das "button" -Tag enthält die Informationen, die die Schaltfläche beschreiben. In diesem Fall ist der Button vom generischen Typ "Button" und der Name ist "Download". Die Wörter zwischen den "" - Tags erscheinen auf der Schaltfläche, wenn die Seite in einem Browser angezeigt wird.

  2. Machen Sie die Schaltfläche auf eine Datei zeigen, wenn ein Benutzer auf sie klickt. Fügen Sie dazu ein "onClick" -Ereignis hinzu:

    Das "onClick" -Ereignis wird ausgeführt, wenn der Benutzer auf die Schaltfläche klickt. In diesem Fall öffnet sich ein neues Fenster, das auf die Adresse der Datei zeigt.


  3. Speichern Sie die Datei und öffnen Sie sie in Ihrem Webbrowser. Speichern Sie mit der Erweiterung "html" (z. B. "test.html"). Öffnen Sie es im Browser. Die Schaltfläche wird in der oberen linken Ecke des Fensters angezeigt. Ein Klick darauf leitet den Benutzer an die Datei weiter und beginnt mit dem Download.

Wie

  • Dieser Code kann kopiert und in ein beliebiges HTML-Dokument eingefügt werden. Lesen Sie die Website "W3C Schools" (w3schools.com), um mehr über die Funktionsweise von HTML-Schaltflächen zu erfahren.

Was du brauchst

  • Texteditor
  • Webbrowser

Referenzen

  • W3C-Schulen: Schaltfläche "HTML-Tag"
  • JavaScript Coder: Verwenden der Window.Open-Methode

Flüge

  • W3C-Schulen: Schaltfläche "HTML-Tag"