图片提交按钮 ‹input type='image'›

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

 

属性

说明

src

此属性指定要在图形提交按钮上显示的图像位置的URI;否则将被忽略。

width

此属性定义为按钮显示的图像的宽度。

height

此属性定义为按钮显示的图像的高度。

formaction

处理输入元素提交的信息的程序的 URI(此处为图像,如果指定),它将覆盖元素的窗体所有者的 action 属性。

Formenctype

如果输入元素是图像,则此属性指定用于将表单提交到服务器的内容类型。可能的值包括:

参数

描述

application/x-www-form-urlencoded

如果未指定属性,则为默认值。

multipart/form-data

如果使用的 <input> 元素且 type 属性设置为 file ,请使用此值

text/plain

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

 

formmethod

在图像输入元素中,此属性指定浏览器用于提交表单的 HTTP 方法。可能的值包括:

参数

描述

post

表单中的数据包含在表单的正文中,并发送到服务器。

get

表单中的数据将追加到表单属性 URI 中,并使用“?”作为分隔符,并将生成的 URI 发送到服务器。当窗体没有副作用并且仅包含 ASCII 字符时,请使用此方法。如果指定,此属性将覆盖元素的窗体所有者 method 属性。

 

formnovalidate

此布尔属性指定在提交表单时不对其进行验证。如果指定了此属性,它将覆盖元素的窗体所有者的 novalidate 属性

formtarget

此属性是一个名称或关键字,指示在何处显示提交表单后收到的响应。这是浏览上下文(例如,选项卡、窗口或内联框架)的名称或关键字。如果指定了此属性,它将覆盖元素的窗体所有者的 target 属性。以下关键字具有特殊含义

关键字

描述

_self

将响应加载到与当前响应相同的浏览上下文中。如果未指定属性,则此值是默认值。

_blank

将响应加载到新的未命名浏览上下文中。

_parent

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

_top

将响应加载到顶级浏览上下文(即,作为当前浏览上下文的祖先且没有父上下文的浏览上下文)中。如果没有父项,则此选项的行为方式与 相同。_self

 

required

 该属性指定用户必须在提交表单之前填写一个值,但当 type 属性为图像类型(提交、重置或按钮)时不能使用。 :optional :required CSS 伪类将酌情应用于该字段。

示例

<!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>

        <input type="image" name="image" src="/files/submit.jpg" width="50">

    </form>

</body>

 

</html>

 

浏览器运行结果如下:

 

 

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