HTML - Element: <button>
Mit dem <button>-Tag erstellen Sie einen anklickbaren Button. Solche Buttons sind flexibler als herkömmliche
Buttons, denn sie dürfen auch einen durch HTML definierten Inhalt haben, etwa eine Grafik.
Mit dem Event-Handler Attribut onclick=""
können diese Buttons eine JavaScript-Funktion ausführen.
<!DOCTYPE html> <html> <head> <title>Button mit Funktion</title> </head> <body> <h1>Button mit Funktion</h1> <button type="button" onclick="alert('Hallo Besucher!');"> <img src="logo.png" width="38" height="38" alt="Logo"> <br>Webbausteine.de </button> </body> </html>
Attribute
name="testi"
- Bezeichnername.
type="button"
- Button um eine Aktion auszuführen.
type="submit"
- Button um das Formular abzusenden (Standardeinstellung).
type="submit" formaction="edit.php"
- Button um das Formular zur Datei: edit.php zu senden *1.
type="reset"
- Button um das Formular zurück zu setzen (Eingegebene Daten werden verworfen).
value="Mein Test"
- Inhalt der gesendet werden soll.
value="Mein Test"
- Inhalt der gesendet werden soll.
➤
Sie sollten auf Reset-Buttons (type="reset"
) weitestgehend verzichten:
Wer ein Formular nicht absenden möchte, kann die Seite einfach verlassen.
Wer jedoch versehentlich ein umfangreiches Formular leert, obwohl er es eigentlich absenden wollte, ist zu Recht frustriert.
<button name="action" value="1">Erstellen</button> <button name="action" value="2">Aktualisieren</button>
*1
<form action="newuser.php" method="post"> <button type="submit"> Neuer Benutzer </button> <button type="submit" formaction="delete.php"> Löschen </button> <button type="submit" formaction="edit.php"> Bearbeiten </button> …
Bausteine Alle Anzeigen
Eine zufällige Auswahl von Codeschnipseln
aus den Bereichen
HTML, CSS,
PHP, JavaScript und
MySQL.
<wbr> Zeilenumbruch erlauben