HTML <button>
Tag
HTML
The <button>
Tag is used to submit a form or trigger a function by the user.
HTML <button>
Tag
HTML <button>
element is an interactive element that is activated by the user via mouse, keyboard, finger, voice commands or other assistive technology.
The type attribute should always be specified for a <button>
tag.
Images and text may be used within the <button>
tag.
Element Attributes
Attribute | Value | Description |
---|---|---|
autofocus |
autofocus | This specifies that a button should automatically focus when the page is loaded. |
disabled |
disabled | This specifies that a button should be disabled. |
form |
form_id | Specifies which form the button belongs to. |
formaction |
action_url | Specifies where the form data should be sent when submitting the form. It is used for submit type. |
formenctype |
application/x-www-form-urlencoded multipart/form-data text/plain |
It specifies how the form data should be encoded before being sent to the server. Only for type="submit". |
formmethod |
get post |
It specifies how to send form data using HTTP method. Only for type="submit" |
formnovalidate |
formnovalidate | Specifies that the form should not be validated at the time of data submission. Only for type="submit". |
formtarget |
_blank _self _parent _top filename |
It specifies where to display response after submitting the form. Only for type="submit". |
name |
name | It specifies the name of the button. |
type |
button reset submit |
Specifies the type of button. |
value |
text | This specifies the value of the button. |
Global attributes
Global attributes may be applied on all elements, although some elements may have no effect on them.
<accesskey>
,
<class>
,
<contenteditable>
,
<contextmenu>
,
<data-*>
,
<dir>
,
<draggable>
,
<dropzone>
,
<hidden>
,
<id>
,
<lang>
,
<spellcheck>
,
<style>
,
<tabindex>
,
<title>
,
<translate>
.
Global Event Handler Attributes
Global Event Handler attributes may be applied on all elements, although some elements may have no effect on them.
<onabort>
,
<onautocomplete>
,
<onautocompleteerror>
,
<onblur>
,
<oncancel>
,
<oncanplay>
,
<oncanplaythrough>
,
<onchange>
,
<onclick>
,
<onclose>
,
<oncontextmenu>
,
<oncuechange>
,
<ondblclick>
,
<ondrag>
,
<ondragend>
,
<ondragenter>
,
<ondragleave>
,
<ondragover>
,
<ondragstart>
,
<ondrop>
,
<ondurationchange>
,
<onemptied>
,
<onended>
,
<onerror>
,
<onfocus>
,
<oninput>
,
<oninvalid>
,
<onkeydown>
,
<onkeypress>
,
<onkeyup>
,
<onload>
,
<onloadeddata>
,
<onloadedmetadata>
,
<onloadstart>
,
<onmousedown>
,
<onmouseenter>
,
<onmouseleave>
,
<onmousemove>
,
<onmouseout>
,
<onmouseover>
,
<onmouseup>
,
<onmousewheel>
,
<onpause>
,
<onplay>
,
<onplaying>
,
<onprogress>
,
<onratechange>
,
<onreset>
,
<onresize>
,
<onscroll>
,
<onseeked>
,
<onseeking>
,
<onselect>
,
<onshow>
,
<onsort>
,
<onstalled>
,
<onsubmit>
,
<onsuspend>
,
<ontimeupdate>
,
<ontoggle>
,
<onvolumechange>
,
<onwaiting>
.
Learning with HTML Editor "Try it Now"
You can edit the HTML code and view the result using online editor.
Sample Code
Copy each file contents and paste it to your own project and run to see the final output
Click on the "Try it Now" button to see how it works.