HTMLButtonElement

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

* Some parts of this feature may have varying levels of support.

HTMLButtonElement 接口提供操作 button 元素(除了 <button> 对象,这个接口对继承了该对象的元素也有效)的属性和方法。

属性

从父对象HTMLElement继承的属性。

名字 类型 描述
accessKey DOMString 一个键盘字符构成的字符串,表明用哪个键盘字符能够访问这个按钮。
autofocus Boolean 这个控件是否可以在页面加载时自动得到焦点。但用户选择了其他焦点除外。只有和表单关联的按钮该特性才有效。
disabled Boolean 这个控件是否被禁用。被禁用的控件不接受任何输入和点击。
form 只读 HTMLFormElement 这个按钮所关联的表单元素。如果这个按钮是一个表单元素的后代元素,那么这个属性的值就是那个表单元素。
如果这个按钮不是一个表单元素的后代元素,那么这个数学可以是任意同文档中的表单元素,或者是 null 表明它没有关联任何表单。
formAction DOMString 一个处理提交信息的 URI 资源地址。如果指定该属性,会覆盖拥有该元素的 <form> 元素的 action 属性。
formEncType DOMString 表单要提交给服务器处理的内容的类型。如果指定该属性,会覆盖拥有该元素的 <form> 元素的 enctype 属性。
formMethod DOMString 浏览器提交表单内容的 HTTP 方法。如果指定该属性,会覆盖拥有该元素的 <form> 元素的 method 属性。
formNoValidate Boolean 表明这个表单提交时是否需要验证。如果指定该属性,会覆盖拥有该元素的 <form> 元素的 novalidate 属性。
formTarget DOMString 一个名字或关键字,用于表明显示服务器响应的页面。如果指定该属性,会覆盖拥有该元素的 <form> 元素的 target 属性。
labels 只读 NodeList 一个 <label> 元素表,说明哪些标签是归属这个按钮的。
menu 实验性 HTMLMenuElement 如果该按钮 type="menu",被点击的时候应该显示的菜单。
name DOMString 提交到服务器时表单描述该对象的 name。如果指定该属性,不能使用空字符串。
tabIndex long 用于表示该元素在 tab 按钮跳动过程中的序号的一个数字。
type DOMString 表明按钮的行为。这个属性是枚举类型,可以是以下的值:
  • "submit":这个按钮会提交表单。如果不指定该属性,这是默认值。可以动态改为空值或者无效值。
  • "reset":用于重置(清空)表单。
  • "button":什么都不做的按钮。通常通过 Javascript 挂载事件。
  • "menu":显示菜单的按钮 实验性
validationMessage 只读 DOMString 报告该控件不满足验证要求的,提示给用户的看的信息。如果这个控件没有验证约束(willValidate 值为 false),或者满足验证的要求,那么这个属性为空字符串。
validity 只读 ValidityState 这个控件当前的验证状态。
value DOMString 这个控件当前的表单值。
willValidate Boolean 表明这个按钮是否需要在提交前进行验证。如果不需要,这个属性值为false

方法

从父对象HTMLElement继承的方法。

名字 返回类型 描述
checkValidity() Boolean 对按钮元素不支持。
setCustomValidity(in DOMString error) void 对按钮元素不支持。

在基于 Gecko 的浏览器中,在表单验证时会使用 :-moz-submit-invalid 伪类修饰提交按钮。

规范

Specification
HTML
# htmlbuttonelement

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
HTMLButtonElement
checkValidity
command
Experimental
commandForElement
Experimental
disabled
form
formAction
formEnctype
formMethod
formNoValidate
formTarget
labels
name
popoverTargetAction
popoverTargetElement
Implicit anchor reference via popoverTargetElement
Experimental
reportValidity
setCustomValidity
type
validationMessage
validity
value
willValidate

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
In development. Supported in a pre-release version.
In development. Supported in a pre-release version.
No support
No support
Experimental. Expect behavior to change in the future.
See implementation notes.
User must explicitly enable this feature.

参见

  • 实现该接口的 HTML 元素:<button>