提交按钮 ‹input type='submit'›

isixe 2020-06-06 14:15:15
Categories: Tags:

 

属性

说明

value

包含一个展示在按钮标签上的文本,否则按钮没有 value

formaction

一个字符串,指示要将数据提交到的 URL。 这优先于拥有 <input> <form> 元素上的 action 属性。

formenctype

一个字符串,标识在将表单数据提交到服务器时要使用的编码方法

如果指定,则 formenctype 属性的值将覆盖拥有表单的 action属性

有三个允许的值:

参数

描述

application/x-www-form-urlencoded

这是默认值,它使用 encodeURI() 之类的算法对文本进行 URL 编码后,以字符串形式发送表单数据。

multipart/form-data

使用 FormData API 来管理数据,从而允许将文件提交到服务器。 如果您的表单包含 type file (<input type="file">) 的任何 <input> 元素,则必须使用此编码类型。

text/plain

纯文本; 通常仅对调试有用,因此您可以轻松查看要提交的数据。

 

formmethod

一个字符串,指示提交表单数据时要使用的 HTTP 方法; 此值将覆盖拥有表单上给出的任何 method 属性。 允许的值为:

参数

描述

get

通过从 formaction action 通过从 ("?") 字符,然后附加表单数据,按照如下所述进行编码来构造 URL 通过 formenctype 或表单的 enctype 属性。 然后,使用 HTTP get请求将该 URL 发送到服务器。 此方法适用于仅包含 ASCII 字符且没有副作用的简单形式。 这是默认值。

post

表单的数据包含在请求的正文中,该请求的正文使用 HTTP post 发送到由 formaction action 属性指定的 URL 请求。 此方法支持复杂的数据和文件附件。

dialog

此方法用于指示按钮仅关闭与输入关联的对话框,而根本不传输表单数据。

 

formnovalidate

布尔属性,如果存在,则指定在提交给服务器之前不应对表单进行验证。 这将覆盖元素拥有表单上的 novalidate 属性的值。

formtarget

一个字符串,它指定一个名称或关键字,该名称或关键字指示提交表单后在何处显示收到的响应。 该字符串必须是浏览上下文的名称 (即选项卡,窗口或 <iframe>。 此处指定的值将覆盖 <form> 上拥有此输入的 target 属性

参数

描述

_self

将响应加载到与包含表单的浏览上下文相同的浏览上下文中。 这将用接收到的数据替换当前文档。 如果未指定,则使用默认值。

_blank

将响应加载到新的未命名浏览上下文中。 这通常是一个与当前文档相同的窗口中的新选项卡,但是根据 user agent 的配置可能会有所不同。

_parent

将响应加载到当前浏览器的父浏览上下文中。 如果没有父上下文,则其行为与 _self 相同。

_top

将响应加载到顶级浏览上下文中; 这是浏览上下文,它是当前上下文的最高级祖先。 如果当前上下文是最顶层的上下文,则其行为与 _self相同。

 

示例

<!DOCTYPE html>

<html lang="en">

 

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

 

<body>

    <form>

        <div>

            <label for="example">Let's submit some text</label>

            <input id="example" type="text" name="text">

        </div>

        <div>

            <input type="submit" value="Send">

        </div>

    </form>

</body>

 

</html>

 

浏览器运行结果如下:

 

 

来自 <https://developer.mozilla.org/zh-CN/docs/Web/HTML/Element/Input/submit>