HTML5 button.formaction 属性在 <form> 之外不起作用
Posted
技术标签:
【中文标题】HTML5 button.formaction 属性在 <form> 之外不起作用【英文标题】:HTML5 button.formaction Attribute Not Working Outside of <form> 【发布时间】:2014-07-28 03:15:59 【问题描述】:为什么button.formaction
属性在<form>
之外不起作用?
这失败了:
<button type="submit" formaction="a.jsp">a<button>
<button type="submit" formaction="b.jsp">b<button>
<button type="submit" formaction="c.jsp">c<button>
但是,这对我有用:
<form action="foo.jsp" method="post">
<button type="submit" formaction="a.jsp">a<button>
<button type="submit" formaction="b.jsp">b<button>
<button type="submit" formaction="c.jsp">c<button>
</form>
但在我的应用程序中,使用表单对我来说没有意义,因为我不想访问 foo.jsp
,而且我没有默认值。是否有某种方法可以在不使用虚拟值或将表单默认为 a.jsp
的情况下使 formaction 工作?
【问题讨论】:
我不知道,但一个名为formaction
的属性似乎只适用于 form
。
是的,这是有道理的。我想我想了解的是,将其与规范中的表格联系起来的原因是什么?只是将演示与逻辑分开吗?那为什么要引入formaction...?
既然你在做一个formaction,它会在request中发送form数据。所以你需要一个表单来提交。
如果困扰您的是虚拟操作属性,请不要指定它
【参考方案1】:
一般form
元素用于向服务器发送数据。它环绕指定数据的元素,例如input
或button
元素。如果您将name
和value
属性添加到您的按钮元素,您会将此name-value-pair 发送到您的服务器。
如果您不需要向服务器发送任何(额外)数据,只需使用链接元素并使用 CSS 将它们设置为按钮样式:
<a href="a.jsp" class="btn">a</a>
<a href="b.jsp" class="btn">b</a>
<a href="c.jsp" class="btn">c</a>
formaction
属性
使用formaction
属性,您可以为一个 表单指定多个提交URL。因为form
元素不再需要action
属性,所以您可以在提交按钮的formaction
中定义提交URL。提交表单时,浏览器首先检查formaction
属性;如果不存在,它将继续在表单元素上查找 action
属性。所以 form 动作 类似于后备或默认,它不是必需的:
<form method="post">
<input type="text" name="my-data" value="my data"/>
<button type="submit" formaction="a.jsp">a</button>
<button type="submit" formaction="b.jsp">b</button>
<button type="submit" formaction="c.jsp">c</button>
</form>
如果您使用按钮上的form
属性 来引用关联的表单(id 值),您甚至可以将按钮放在form
元素之外:
<form method="post" id="myForm">
<input type="text" name="my-data" value="my data"/>
</form>
<button type="submit" formaction="a.jsp" form="myForm">a</button>
<button type="submit" formaction="b.jsp" form="myForm">b</button>
<button type="submit" formaction="c.jsp" form="myForm">c</button>
【讨论】:
以上是关于HTML5 button.formaction 属性在 <form> 之外不起作用的主要内容,如果未能解决你的问题,请参考以下文章