<input type="reset">

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

Wenn Sie keinen value angeben, erhalten Sie eine Schaltfläche mit der Standardbeschriftung (typischerweise "Zurücksetzen", dies kann jedoch je nach Benutzeragent 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 mittels JavaScript anpassen möchten, sollten Sie entweder <input type="button"> verwenden, oder noch besser, ein <button> Element.

Wir beginnen mit der Erstellung einer einfachen Zurücksetzungsschaltflä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 wie folgt gerendert:

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

Um einer Zurücksetzungsschaltfläche eine Tastenkombination hinzuzufügen — genauso wie bei jedem <input>, bei dem es sinnvoll ist — verwenden Sie das globale Attribut accesskey.

In diesem Beispiel wird r als Zugriffstaste angegeben (Sie müssen r plus die speziellen Modifikatortasten für Ihre Browser-/Betriebssystemkombination drücken; sehen Sie sich die Seite accesskey für eine nützliche Liste dieser Tasten an).

<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 bei obigem Beispiel ist, dass der Benutzer nicht weiß, was die Zugriffstaste ist! Dies gilt insbesondere, da die Modifikatoren typischerweise nicht standardmäßig sind, um Konflikte zu vermeiden. Beim Erstellen einer Website sollten Sie sicherstellen, dass diese Informationen in einer Weise bereitgestellt werden, die das Design der Website nicht beeinträchtigt (zum Beispiel durch einen leicht zugänglichen Link, der auf Informationen verweist, welche die Zugriffstasten der Website sind). Ein Tooltip (mithilfe des title Attributs) an der Schaltfläche kann auch hilfreich sein, obwohl dies keine vollständige Lösung für Barrierefreiheitszwecke darstellt.

Um eine Zurücksetzungsschaltflä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 dies wie btn.disabled = true oder btn.disabled = false aus.

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

Wir haben oben grundlegende Beispiele aufgenommen. Es gibt eigentlich nichts Weiteres, das über Zurücksetzungsschaltflächen gesagt werden muss.

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