HTML/Tutorials/Formulare/input/button
Aus SELFHTML-Wiki
Beachten Sie: Input-Elemente zum Auslösen von Benutzeraktionen sind zwar nicht als veraltet oder missbilligt gekennzeichnet, sie sollten dennoch nicht mehr verwendet werden. Siehe dazu auch SELFHTML-Blog input oder button für submit-Elemente
Empfehlung: Verwenden Sie für Buttons anstelle von
- input type = "button"
- input type = "submit"
- input type = "reset"
Inhaltsverzeichnis
input type = "button"
input type = "submit"
input type = "reset"
input type = "image"
Mit <input type="image">
können sie einen grafischen Absendebutton erzeugen, der mit dem Attribut src
einen Button mit einem Bild unterlegt. Anders als bei einem type="submit" werden zusätzlich zu den Formulardaten auch die Koordinaten des Klicks zum Server gesendet.
Grafiken als Button
ansehen …
<form>
<input type="image" src="Mülleimer.png" alt="Mülleimer als Button">
</form>
Folgende Angaben sind möglich:
-
src
: Angabe der URL der Grafik -
width
: Breite (in Pixeln) der Grafik -
height
Höhe -
alt
: ein Alternativtext, falls das Bild nicht geladen werden kann.
Bei input-Elementen vom Typ image wird nicht nur der eventuell vorhandene Wert im value
Attribut übertragen, sondern zusätzlich auch die Koordinaten des Klicks auf das Bild. Das heißt es werden zwei weitere Werte abgeschickt in der Form name.x
und name.y
(in PHP wird daraus name_x/name_y).
get
an die ursprüngliche Ressource gesendet. Da das input-Element hat keinen Namen hat, endet die URL nach dem Absenden beispielsweise mit?x=31&y=35
.