<input type="reset">

Das value-Attribut eines <input type="reset">-Elements enthält einen String, der als Label der Schaltfläche verwendet wird und der Schaltfläche eine zugängliche Beschreibung bereitstellt. Schaltflächen wie reset haben sonst keinen Wert.

Wenn Sie kein value angeben, erhalten Sie eine Schaltfläche mit der Standardbeschriftung (in der Regel "Zurücksetzen", aber dies variert je nach User-Agent):

<input type="reset" />

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

Wir beginnen mit der Erstellung einer einfachen Zurücksetzen-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>

Dies wird folgendermaßen dargestellt:

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

Um einer Zurücksetzen-Schaltfläche eine Tastenkombination hinzuzufügen – genau wie bei jedem <input>, bei dem es sinnvoll ist – verwenden Sie das accesskey-globale Attribut.

In diesem Beispiel ist r als Zugriffstaste angegeben (Sie müssen r zusammen mit den entsprechenden Modifikatortasten für Ihre Browser-/Betriebssystemkombination drücken; siehe accesskey für eine nützliche 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 beim obigen Beispiel ist, dass der Benutzer nicht erkennen kann, welche Zugriffstaste vorhanden ist! Dies ist besonders dann der Fall, da die Modifikatoren typischerweise nicht standardisiert sind, um Konflikte zu vermeiden. Beim Erstellen einer Website sollte diese Information auf eine Weise bereitgestellt werden, die das Design der Website nicht stört (beispielsweise durch das Bereitstellen eines leicht zugänglichen Links, der auf Informationen zu den Zugriffstasten der Website zeigt). Das Hinzufügen eines Tooltips zur Schaltfläche (mithilfe des title-Attributs) kann ebenfalls hilfreich sein, obwohl es keine vollständige Lösung für Zugänglichkeitszwecke darstellt.

Um eine Zurücksetzen-Schaltfläche zu deaktivieren, geben Sie das disabled-Attribut an, wie folgt:

<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 kann.

Wir haben oben grundlegende Beispiele eingefügt. Es gibt nicht wirklich mehr zu sagen über Zurücksetzen-Schaltflächen.

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