HTML formaction 属性用于指定文件的 URL,该文件将处理输入控件并在提交表单时重定向到不同的页面。它重写表单元素的 action 属性。它与图像和提交类型的输入元素一起使用,也与<button>元素一起使用。
例如,如果图像类型输入元素存在 formaction 属性,则当用户单击图像时,它将重定向到不同的页面。如果用户提交表单,它将重定向到 <form> 元素的 action 属性中指定的 URL。
语法
<tag formaction = "URL"></tag>
适用于
下面列出的元素允许使用 HTML formaction 属性
元素 | 描述 |
---|---|
<input> | HTML <input> 标签用于接受用户的文本输入。 |
<button> | HTML <button> 标签在 HTML 中定义了一个可点击的按钮。 |
HTML formaction 属性示例
下面的示例将说明HTML formaction属性,我们应该在哪里以及如何使用此属性!
具有 formaction 属性的输入元素
在以下示例中,我们将使用带有输入 type=submit 的 HTML formaction 属性。
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML 'formaction' attribute</title>
</head>
<body>
<p>
On clicking login button you will be
redirected to index.html page of
tutorialspoint as mentioned according
to that in action attribute of form tag.
</p>
<form action="html/index.htm" method="get">
<label for="">Username</label>
<input type="text">
<br>
<br>
<label for="">Password</label>
<input type="password">
<br>
<br>
<input type="submit" value="Login">
</form>
<br><br><hr><br>
<p>
Overriding the link in the action
attribute of form tag using formaction
attribute of input tag. This form will
redirect you to tutorialspoint main page
even though link to html page is present
in action attribute.
</p>
<form action="html/index.htm" method="get">
<label for="">Username</label>
<input type="text">
<br>
<br>
<label for="">Password</label>
<input type="password">
<br>
<br>
<input type="submit"
value="Login"
formaction="https://www.qikepu.com">
</form>
</body>
</html>
具有 formaction 属性的按钮元素
考虑到另一种情况,我们将在 button 元素中使用 formaction 属性。
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML 'formaction' attribute</title>
</head>
<body>
<!--HTML 'formaction' attribute-->
<p>Example of the HTML 'formaction' attribute</p>
<form action="https://www.qikepu.com" method="get">
<label for="">Name</label>
<input type="text">
<br>
<br>
<label for="">Email</label>
<input type="email">
<br>
<br>
<label for="">Mobile</label>
<input type="number">
<br>
<br>
<button>Submit 1</button>
<button formaction="/html/index.htm">Submit 2</button>
</form>
<p>
Submit 1 will redirect you home page of tutorialspoint
as it's mentioned in action attribute of form tag, while
submit 2 will override this using formaction and will submit
to html page of tutorialspoint.
</p>
</body>
</html>
支持的浏览器
浏览器 | ![]() |
![]() |
![]() |
![]() |
![]() |
---|---|---|---|---|---|
是否支持 | 9.0 | 10.0 | 4.0 | 5.1 | 15.0 |