<input type="reset">

Das value-Attribut eines <input type="reset">-Elements enthält eine Zeichenfolge, die als Beschriftung der Schaltfläche verwendet wird und der Schaltfläche eine zugängliche Beschreibung bietet. Schaltflächen wie reset haben ansonsten keinen Wert.

Wenn Sie keinen value angeben, erhalten Sie eine Schaltfläche mit der Standardbeschriftung (in der Regel "Reset", dies kann jedoch je nach User Agent variieren):

<input type="reset" />

<input type="reset">-Schaltflächen werden verwendet, um Formulare zurückzusetzen. Wenn Sie eine benutzerdefinierte Schaltfläche erstellen und das Verhalten mit JavaScript anpassen möchten, sollten Sie <input type="button"> oder besser noch ein <button>-Element verwenden.

Wir beginnen mit der Erstellung einer grundlegenden Reset-Schaltfläche:

<form>
  <div>
    <label for="example">Type in some sample text</label>
    <input id="example" type="text" />
  </div>
  <div>
    <input type="reset" value="Reset the form" />
  </div>
</form>

Diese wird wie folgt dargestellt:

Versuchen Sie, etwas Text in das Textfeld einzugeben und dann die Reset-Schaltfläche zu drücken.

Um einer Reset-Schaltfläche ein Tastaturkürzel hinzuzufügen – genau wie bei jedem <input>, für das es sinnvoll ist – verwenden Sie das accesskey-Globale Attribut.

In diesem Beispiel wird r als Access Key angegeben (Sie müssen r zusammen mit den entsprechenden Modifikator-Tasten für Ihre Browser-/OS-Kombination drücken; siehe accesskey für eine hilfreiche Liste dieser Kombinationen).

<form>
  <div>
    <label for="example">Type in some sample text</label>
    <input id="example" type="text" />
  </div>
  <div>
    <input type="reset" value="Reset the form" accesskey="r" />
  </div>
</form>

Das Problem mit dem obigen Beispiel ist, dass es für den Benutzer keine Möglichkeit gibt, zu erfahren, welches der Access Key ist! Dies ist besonders problematisch, da die Modifikatoren in der Regel nicht standardisiert sind, um Konflikte zu vermeiden. Wenn Sie eine Website erstellen, stellen Sie sicher, dass Sie diese Informationen auf eine Weise bereitstellen, die das Design der Website nicht beeinträchtigt (z. B. indem Sie einen leicht zugänglichen Link bereitstellen, der auf Informationen darüber verweist, welche Access Keys die Website verwendet). Das Hinzufügen eines Tooltips zur Schaltfläche (durch das title-Attribut) kann ebenfalls hilfreich sein, ist jedoch keine komplette Lösung für Zugänglichkeitszwecke.

Um eine Reset-Schaltfläche zu deaktivieren, geben Sie das disabled-Attribut an:

<input type="reset" value="Disabled" disabled />

Sie können Schaltflächen zur Laufzeit aktivieren und deaktivieren, indem Sie disabled auf true oder false setzen; in JavaScript sieht das so aus: btn.disabled = true oder btn.disabled = false.

Schaltflächen nehmen nicht an der Einschränkungsvalidierung teil; sie haben keinen echten Wert, der eingeschränkt werden könnte.

Wir haben oben grundlegende Beispiele hinzugefügt. Es gibt wirklich nicht viel mehr über Reset-Schaltflächen zu sagen.

• <input> und die HTMLInputElement-Schnittstelle, die es implementiert.
• Formulare und Schaltflächen
• HTML-Formulare
• Das <button>-Element