HTML - formaction 属性_HTML 菜鸟教程

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

<< HTML - enctype 属性 HTML - headers 属性 >>