HTML input type button 类型

🌙
手机阅读
本文目录结构

功能介绍

元素<input type="button"><input> 元素的特殊版本,被用来创建一个没有默认值的可点击按钮。

它已经在HTML5被 <button> 元素取代

浏览器生成一个控件没有默认值的可点击按钮。该按钮上可有任何标签。该控件在不同的浏览器上,可能有不同的样式。

属性

除以下内容外,该元素可以具有任何全局属性:

disabled

此布尔值属性指示用户无法与按钮进行交互。

如果未指定此属性,则按钮从包含元素继承其设置,例如<fieldset>;

如果没有包含disabled属性设置的包含元素,则启用按钮。禁用控件的值未随表单一起提交,并且该 click事件将不会在禁用控件上分派。

Firefox会,不像其他的浏览器,默认情况下,坚持动态禁用状态的<button>跨页面加载。使用autocomplete属性控制此功能。

autofocus HTML5

使用此布尔属性,可以指定在页面加载时按钮应具有输入焦点,除非用户将其覆盖,例如通过键入其他控件来覆盖它。文档中只有一个与表单相关的元素可以指定此属性。

autocomplete

在上使用此属性<button>是非标准且特定于Firefox的。默认情况下,不像其他的浏览器,火狐仍然存在动态禁用状态的<button>跨页面加载。

将此属性的值设置为off(即autocomplete=“off”)将禁用此功能。

form HTML5

与按钮关联的表单元素(其表单所有者)。

该属性的值必须是同一文档中元素的id属性<form>

如果未指定此属性,则该<button>元素必须是form元素的后代。

此属性使您可以将<button>元素放置在文档中的任何位置,而不仅仅是<form>元素的后代。

formenctype

由于input元素是一个提交按钮,因此该formenctype属性指定用于将表单提交到服务器的内容类型。可能的值为: application/x-www-form-urlencoded:如果未指定属性,则为默认值。 multipart/form-data:如果<input>使用type属性设置为的元素,则使用此值file。 text/plain 如果指定了此属性,它将覆盖enctype元素的表单所有者的属性。

formaction HTML5

处理按钮提交的信息的程序的URI。如果指定,它将覆盖action按钮的表单所有者的属性。

formmethod

由于input元素是一个提交按钮,因此该formmethod属性指定浏览器用来提交表单的HTTP方法。可能的值为:

  • post:来自表单的数据包含在表单主体中,并发送到服务器。
  • get:来自表单的数据会附加到表单属性URI,并带有“?” 作为分隔符,结果URI被发送到服务器。当表单没有副作用并且仅包含ASCII字符时,请使用此方法。

如果指定,此属性将覆盖method元素的表单所有者的属性。

formnovalidate

由于input元素是一个提交按钮,因此该formnovalidate 属性指定在提交表单时不对其进行验证。如果指定了此属性,它将覆盖novalidate元素的表单所有者的属性。这是一个布尔属性。

formtarget

由于输入元素是提交按钮,因此formtarget属性是名称或关键字,指示在提交表单后在何处显示收到的响应。这是浏览上下文(例如,选项卡,窗口或嵌入式框架)的名称或关键字。如果指定了此属性,它将覆盖target元素的表单所有者的属性。以下关键字具有特殊含义:

  • _ self:将响应加载到与当前响应相同的浏览上下文中。如果未指定属性,则此值为默认值。
  • _blank:将响应加载到新的未命名浏览上下文中。
  • _parent:将响应加载到当前响应的父浏览上下文中。如果没有父母,则此选项的行为与相同_self。
  • _top:将响应加载到顶级浏览上下文(即,当前上下文的祖先且没有父级的浏览上下文)中。如果没有父母,则此选项的行为与相同_self。

name

按钮的名称,与表单数据一起提交。

type

按钮的类型。可能的值为:

  • submit:按钮将表单数据提交到服务器。如果未指定属性,或者该属性动态更改为空或无效值,则这是默认设置。
  • reset:该按钮将所有控件重置为其初始值。
  • button:该按钮没有默认行为。它可以具有与元素的事件相关联的客户端脚本,这些脚本在事件发生时触发。

value

按钮的初始值。

举例

这创建一个新的按钮<input>元素,文本显示出 ‘Click me’。

<input type="button" value="Click me">

参考网站:https://developer.mozilla.org/zh/docs/web/html/element/input/button

AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

于2021年离开前端领域,目前重心放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>

于2021年离开前端领域,目前从事区块链方面工作了