<input type="reset">

注意：你通常应该避免在表单中包含重置按钮。它们很少有用，而且更有可能让误点击它们的用户感到沮丧（通常是在尝试点击 提交按钮 时）。

¥Note: You should usually avoid including reset buttons in your forms. They're rarely useful, and are instead more likely to frustrate users who click them by mistake (often while trying to click the submit button).

¥Value

<input type="reset"> 元素的 value 属性包含一个字符串，该字符串用作按钮的标签，为按钮提供 accessible description。否则，诸如 reset 之类的按钮没有值。

¥An <input type="reset"> element's value attribute contains a string that is used as the button's label providing the button with an accessible description. Buttons such as reset don't have a value otherwise.

¥Setting the value attribute

<input type="reset" value="Reset the form" />

¥Omitting the value attribute

如果你不指定 value，你会得到一个带有默认标签的按钮（通常为 "重置，"，但这会根据 user agent 的不同而有所不同）：

¥If you don't specify a value, you get a button with the default label (typically "Reset," but this will vary depending on the user agent):

<input type="reset" />

¥Using reset buttons

<input type="reset"> 按钮用于重置表单。如果你想创建自定义按钮，然后使用 JavaScript 自定义行为，则需要使用 <input type="button">，或者更好的是，使用 <button> 元素。

¥<input type="reset"> buttons are used to reset forms. If you want to create a custom button and then customize the behavior using JavaScript, you need to use <input type="button">, or better still, a <button> element.

¥A simple reset button

我们首先创建一个简单的重置按钮：

¥We'll begin by creating a simple reset button:

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

呈现如下：

¥This renders like so:

尝试在文本字段中输入一些文本，然后按重置按钮。

¥Try entering some text into the text field, and then pressing the reset button.

¥Adding a reset keyboard shortcut

要向重置按钮添加键盘快捷键（就像使用任何有意义的 <input> 一样），你可以使用 accesskey 全局属性。

¥To add a keyboard shortcut to a reset button — just as you would with any <input> for which it makes sense — you use the accesskey global attribute.

在此示例中，r 被指定为访问键（你需要按 r 加上适合你的浏览器/操作系统组合的特定修饰键；有关有用的列表，请参阅 accesskey）。

¥In this example, r is specified as the access key (you'll need to press r plus the particular modifier keys for your browser/OS combination; see accesskey for a useful list of those).

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

上面示例的问题是用户无法知道访问密钥是什么！由于修饰符通常是非标准的以避免冲突，因此尤其如此。构建站点时，请确保以不干扰站点设计的方式提供此信息（例如，通过提供易于访问的链接来指向有关站点访问密钥的信息）。向按钮添加工具提示（使用 title 属性）也有帮助，尽管这并不是一个用于辅助功能的完整解决方案。

¥The problem with the above example is that there's no way for the user to know what the access key is! This is especially true since the modifiers are typically non-standard to avoid conflicts. When building a site, be sure to provide this information in a way that doesn't interfere with the site design (for example by providing an easily accessible link that points to information on what the site access keys are). Adding a tooltip to the button (using the title attribute) can also help, although it's not a complete solution for accessibility purposes.

¥Disabling and enabling a reset button

要禁用重置按钮，请指定其 disabled 属性，如下所示：

¥To disable a reset button, specify the disabled attribute on it, like so:

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

你可以通过将 disabled 设置为 true 或 false 在运行时启用和禁用按钮；在 JavaScript 中，这看起来像 btn.disabled = true 或 btn.disabled = false。

¥You can enable and disable buttons at run time by setting disabled to true or false; in JavaScript this looks like btn.disabled = true or btn.disabled = false.

注意：有关启用和禁用按钮的更多想法，请参阅 <input type="button"> 页面。

¥Note: See the <input type="button"> page for more ideas about enabling and disabling buttons.

¥Validation

按钮不参与约束验证；它们没有真正的价值需要受到限制。

¥Buttons don't participate in constraint validation; they have no real value to be constrained.

¥Examples

我们在上面提供了简单的示例。关于重置按钮确实没有什么可说的。

¥We've included simple examples above. There isn't really anything more to say about reset buttons.

¥Technical summary

¥See also

• <input> 和实现它的 HTMLInputElement 接口。
• 表格和按钮
• HTML 表单
• <button> 元素
• CSS 属性的兼容性