HTML参考手册
标签 | Elements
button
HTML<button>元素表示一个可点击的按钮。能够在表单，或者 HTML 文档的任一需要按钮的位置。默认情况下 HTML 按钮会呈现与用户主机相似的样式，基于user agent。
内容类别 |
流内容，措辞内容，交互内容，列出，可引用和可提交的表单相关的内容。 |
|---|---|
允许的内容 |
短语内容。 |
标记遗漏 |
没有，起始和结束标签都是强制性的。 |
允许父母 |
任何接受短语内容的元素。 |
允许ARIA角色 |
复选框，链接，menuitem，menuitemcheckbox，menuitemradio，收音机，开关，选项卡 |
DOM界面 |
HTMLButtonElement |
属性
该元素包含 全局属性.
autofocusHTML5一个布尔属性，用于指定当页面加载时按钮必须有输入焦点，除非用户重写，例如通过不同控件键入。只有一个表单关联元素可以指定该属性。
autocomplete该属性在<button>上的使用并未标准化，只有Firefox允许。不像其它浏览器，Firefox默认在页面加载时持续禁用Button的动态状态（Firefox persists the dynamic disabled state ）。将此属性设置为off (i.e. autocomplete="off")关闭此特性。参见 bug 654072。
disabled
此布尔属性表示用户不能与button交互。如果属性值未指定，button继承包含元素，例如<fieldset>；如果没有设置disabled属性的包含元素，button将可交互。
不像其它浏览器，Firefox默认在页面加载时持续禁用Button的动态状态。使用autocomplete属性可控制此特性。
formHTML5表示button元素关联的form元素（它的表单拥有者）。此属性值必须为同一文档中的一个<form>元素的id属性。如果此属性未指定，<button>元素必须是form元素的后代。利用此属性，你可以将<button>元素放置在文档内的任何位置，而不仅仅是作为他们form元素的后代。
formactionHTML5表示程序处理button提交信息的URI。如果指定了，将重写button表单拥有者的action属性。
formenctypeHTML5如果button是submit类型，此属性值指定提交表单到服务器的内容类型。可选值：
-
application/x-www-form-urlencoded: 未指定时的默认值。
-
multipart/form-data: 如果使用type属性的<input>元素设置文件，使用此值。
text/plain
如果指定此属性，它将重写button的表单拥有者的enctype属性。
formmethodHTML5If the button is a submit button, this attribute specifies the HTTP method that the browser uses to submit the form. Possible values are:
-
post: 来自表单的数据被包含在表单内容中，被发送到服务器。
-
get: 来自表单的数据以'?'作为分隔符被附加到form的URI属性中，得到的URI被发送到服务器。当表单没有副作用，且仅包含ASCII字符时使用这种方法。
如果指定了，此属性会重写button拥有者的method属性。
formnovalidateHTML5如果button是submit类型，此布尔属性指定当表单被提交时不需要验证。如果指定了，它会重写button拥有者的novalidate属性。
formtargetHTML5如果button是submit类型，此属性指定一个名称或关键字，表示接收提交的表单后在哪里显示响应。这是一个浏览上下文（例如tab，window或内联框架）的名称或关键字。如果指定了，它会重写button拥有者的target属性。关键字如下：
-
_self: 在同一个浏览上下文中加载响应作为当前的。未指定时此值为默认值。
-
_blank: 在一个新的不知名浏览上下文中加载响应。
-
_parent: 在当前浏览上下文父级中加载响应。如果没有父级的，此选项将按_self执行。
-
_top: 在顶级浏览上下文（即当前浏览上下文的祖先，且没有父级）中架加载响应。如果没有顶级的，此选项将按_self执行。
namebutton的名称，与表单数据一起提交。typebutton的类型。可选值：
-
submit: 此按钮提交表单数据给服务器。未指定时，此值为默认值，或者如果此属性动态变为空值或无效值。
- reset: 此按钮重置所有组件为初始值。
- button: 此按钮没有默认行为。它可以有与元素事件相关的客户端脚本，当事件出现时可触发。
valuebutton的初始值。它定义的值与表单数据的提交按钮相关联。当表单中的数据被提交时，这个值便以参数的形式被递送至服务器。
注
<button>元素比<input>元素更易样式化。你可以添加内联HTML内容（如<em>，<strong> 甚至<img>），并使用:after和:before伪元素实现复杂的渲染，而<input>只有文本值属性。
IE7有一个bug，当使用<button type="submit" name="myButton" value="foo">Click me</button>提交表单时，POST数据发送为myButton=Click me而不是myButton=foo。
IE6有一个更糟糕的bug，当使用一个button提交表单时，所有button会出现IE7中的bug。
这个bug在IE8中已修复。
出于访问性的目的，Firefox会给获得焦点的button加一个点状边框。此边框通过浏览器样式表中的CSS声明，但如果需要添加自己的聚焦样式，可使用button::-moz-focus-inner{ }重写。
不像其它浏览器，Firefox默认在页面加载时持续禁用Button的动态状态（Firefox persists the dynamic disabled state ）。将此属性设置为off (i.e. autocomplete="off")关闭此特性。参见 bug 654072。
Firefox 35 之前，Android 会在所有按钮上设置默认的 background-image渐变（见bug 763671）。这可以使用background-image: none 来禁用。
Click和focus事件
无论是点击a <button>会导致它（默认情况下）成为焦点因浏览器和操作系统而异。对于结果<input>的type="button"和type="submit"是一样的。
Desktop Browsers |
Windows 8.1 |
OS X 10.9 |
|---|---|---|
Firefox 30.0 |
Yes |
No (even with a tabindex) |
Chrome 35 |
Yes |
Yes |
Safari 7.0.5 |
N/A |
No (even with a tabindex) |
Internet Explorer 11 |
Yes |
N/A |
Presto (Opera 12) |
Yes |
Yes |
Mobile Browsers |
iOS 7.1.2 |
Android 4.4.4 |
|---|---|---|
Safari Mobile |
No (even with a tabindex) |
N/A |
Chrome 35 |
No (even with a tabindex) |
Yes |
示例
<button name="button">Click me</button>Please note that this button has CSS applied.
规范
规范 |
状态 |
评论 |
|---|---|---|
HTML Living Standard该规范中的'<button>'的定义。 |
生活水平 |
|
HTML5该规范中'<button>'的定义。 |
建议 |
|
HTML 4.01规范该规范中'<button>'的定义。 |
建议 |
|
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox |
Internet Explorer |
Opera |
Safari |
|---|---|---|---|---|---|---|
Basic Support |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
autofocus |
5 |
(Yes) |
4 |
10 |
9.6 |
5 |
autocomplete |
No |
No |
(Yes) |
No |
No |
No |
disabled |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
form |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
formaction |
9 |
(Yes) |
4 |
10 |
? |
? |
formenctype |
9 |
(Yes) |
4 |
10 |
10.6 |
? |
formmethod |
9 |
(Yes) |
4 |
10 |
? |
? |
formnovalidate |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
formtarget |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
name |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
type |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
value |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
Feature |
Android |
Chrome for Android |
Edge mobile |
Firefox for Android |
IE mobile |
Opera Android |
iOS Safari |
|---|---|---|---|---|---|---|---|
Basic Support |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
autofocus |
? |
? |
? |
4 |
? |
? |
? |
autocomplete |
No |
No |
No |
(Yes) |
(Yes) |
No |
No |
disabled |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
form |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
formaction |
? |
? |
(Yes) |
4 |
? |
? |
? |
formenctype |
? |
? |
(Yes) |
4 |
? |
? |
? |
formmethod |
? |
? |
(Yes) |
4 |
? |
? |
? |
formnovalidate |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
formtarget |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
name |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
type |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
value |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
(Yes) |
标签 | Elements相关
超文本标记语言，它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容（如：文字如何处理，画面如何安排，图片如何显示等）。浏览器按顺序阅读网页文件，然后根据标记符解释和显示其标记的内容，对书写出错的标记将不指出其错误，且不停止其解释执行过程，编制者只能通过显示效果来分析出错原因和出错部位。但需要注意的是，对于不同的浏览器，对同一标记符可能会有不完全相同的解释，因而可能会有不同的显示效果。
加载中,请稍侯......