Sobes.tech
Intern

Was bedeutet das Attribut type mit dem Wert submit in HTML?

sobes.tech KI

Antwort von AI

Das Attribut type="submit" im HTML-Element <button> oder <input> bestimmt, dass dieses Element dazu bestimmt ist, das Formular zu senden. Beim Klicken auf die Schaltfläche mit diesem Attribut sammelt der Browser die Daten aller Elemente des Formulars, in das die Schaltfläche eingebunden ist, und sendet sie an die im action-Attribut des <form>-Tags angegebene URL (oder an die aktuelle URL, wenn action nicht angegeben ist).

So funktioniert es:

  • Innerhalb von <form>: Die Schaltfläche mit type="submit" wird automatisch mit dem nächstgelegenen Eltern-Formular verknüpft. Das Klicken darauf initiiert den Standardprozess des Formularversands per HTTP-Methode, die im method-Attribut angegeben ist (Standard ist GET).
  • Außerhalb von <form>: Eine Schaltfläche mit type="submit" außerhalb eines Formulars hat keine automatische Versandfunktion. Sie kann mit JavaScript verwendet werden, um das Formular manuell zu senden oder andere Aktionen auszuführen.

Beispiel für die Verwendung:

<form action="/submit-handler" method="POST">
  <label for="username">Benutzername:</label>
  <input type="text" id="username" name="username"><br><br>

  <label for="password">Passwort:</label>
  <input type="password" id="password" name="password"><br><br>

  <button type="submit">Formular absenden</button>
</form>

In diesem Beispiel sendet der Browser beim Klicken auf die Schaltfläche "Formular absenden" die Daten der Felder username und password an die URL /submit-handler mittels POST.

Vergleich mit type="button":

Attribut Zweck Automatischer Versand des Formulars Verwendung mit JS
type="submit" Formular absenden Ja Ja
type="button" Beliebige Schaltfläche, nicht mit Versand verbunden Nein Ja