Servus!
@@Samuel fiedler
Das Ergebnis ist aktuell ein Fiddle, prinzipiell fertig fürs Wiki.
Zuerst:
-
Vielen Dank für Dein Beispiel!
-
Herzlichen Glückwunsch zum Beispiele-Administrator.[1] (Du kannst jetzt Live-Beispiele hochladen. Hier gibt es mehr Informationen: Hilfe:Wiki/Beispiele)
Nein. Dieses Ding darf so auf keinen Fall ins Wiki.
Die Betonung liegt auf „so“
Erst müssen die Fehler ausgemerzt werden:
Sämtlichen Eingabefeldern fehlt die Beschriftung.
Man denkt, die Felder sind bereits beispielhaft vorausgefüllt. Sind sie aber nicht.
placeholder
ist so ziemlich das dümmste Feature in HTML. Nicht verwenden!Wenn die Felder vorausgefüllt sein sollen, dann mit
value
.
Der Download-Link führt initial zum aktuellen Dokument;
href=""
ist falsch. Er sollte, wenn’s nichts zum Herunterladen gibt, kein Link sein, d.h. dasa
-Element sollte keinhref
-Attribut haben.Dafür aber ein
hidden
-Attribut, und der Link wird erst angezeigt, wenn er sinnvoll ist. Also beim Setzen vonlink.href
dann auchlink.hidden = false
setzen.
Ganz auf die Schnelle:
<form>
<label for="input_text">Inhalt</label>
<textarea id="input_text" width="80" height="25">Hallo Welt</textarea>
<label for="input_type">MIME-Typ</label>
<input type="text" id="input_type">
<label for="input_name">Vorgeschlagener Dateiname</label>
<input type="text" id="input_name" list="mime">
<datalist id="mime">
<option value="text/css">
<option value="text/html">
<option value="text/html">
<option value="image/svg+xml">
</datalist>
<button id="generate">Download-URL generieren</button>
<a hidden download="" id="download">Noch nichts</a>
</form>
Die br kann man weglassen und durch CSS formatieren!
Wenn man das mit erklärendem Begleittext im Wiki hat, kann man ja mal weitergucken.
Herzliche Grüße
Matthias Scharwies
Ich habe heute rausgefunden, dass in das Pizzafach meines Rucksacks auch ein Laptop passt!
Das Standalone-SVG-Tutorial hat mir gut gefallen! ↩︎