HTML Buttons

A button performs an action. In a form it usually submits; outside a form it should not navigate. The type attribute decides whether it submits, resets, or waits for a script.

A button performs an action on the current page or form. A link navigates to a resource. Keeping that distinction gives people a predictable keyboard, context menu, and history. Inside a form, the default button type is submit—so an omitted type can send the form by accident.

Choose submit, reset, or button on purpose

type=submit sends the form. type=reset restores default values and is easy to activate by mistake; prefer a clearly named undo only when you truly need it. type=button does nothing until a script handles it, which is the right choice for in-page actions. Prefer the button element over input type=submit when the visible label needs text you can style or include an extra word such as a file size.

<form action="/feedback" method="post">
  <label for="comment">Comment</label>
  <textarea id="comment" name="comment"></textarea>
  <button type="submit">Send feedback</button>
  <button type="button">Save draft</button>
</form>

• Use a for navigation and button for actions.
• Set type explicitly; the default inside a form is submit.
• Avoid reset unless restoring defaults is the real job.
• The accessible name usually comes from the button’s text.
• disabled removes the control from operation and from submission.