Question

可能重复：
Multiple submit buttons in an HTML form

我有带多个提交按钮的网络表单。要确定按下了哪个按钮，每个按钮都有不同的名称，如下所示：

<input type="submit" name="foo" value="Foo Foo">

在表单上还有一些普通链接充当提交按钮，如下所示：

<a href="" onclick="parentNode.submit();return false;">
Bar
</a>

我的问题是如何区分用作提交按钮的链接？

不确定这是否相关：
这是表格的开头

<form action="foobar" method="post" enctype="multipart/form-data">

我正在使用Flask（一个基于Werkzeug的微框架），它使用Python（在这种情况下为2.6）。

Answer 1

我的第一个问题是询问您是否需要许多不同的方式来提交相同的表格？这听起来应该改变你的设计，使用户更简单，这将反过来解决你的问题。

如果您必须拥有所有不同的提交按钮/链接，并且需要知道哪一个被按下，请使用以下内容：

<input type="hidden" id="submitClicked" />
<input type="submit" onclick="javascript:document.getElementById('submitClicked').value='linkName';return true;" id="linkName">Submit</input>

注意：我没有测试这段代码，它只是在我的头顶，因此可能需要进行一些修改。

Answer 2

您可以创建名为submitSource的隐藏输入，并根据需要通过链接或按钮onclick事件处理程序设置该值。然后你可以检查服务器端的值。

Answer 3

您应该考虑的另一个解决方案：使用<ìnput type="submit">进行“提交链接”，就像正常的提交按钮一样，并使用CSS将它们设置为看起来像链接。

这有两个巨大的优势，它将（a）处理任何可能潜在破坏的额外代码，并且（b）可以在这个世界上的每一个浏览器上工作。

Answer 4

RedFilter's answer肯定是一个可靠的方法，但这是你的另一个选择：

我通常在所有提交按钮（“命令”或类似按钮）中使用一个名称，因为当然只发送其中一个。然后我的服务器端代码只查看该字段的值以确定要做什么。

您的提交链接可以在表单的操作中附加“命令”参数，例如：

<a href="" onclick="parentNode.action += "?command=bar"; parentNode.submit(); return false;">

即使你不想只使用一个名字，这个概念仍然存在，例如：

<a href="" onclick="parentNode.action += "?bar=bar+bar"; parentNode.submit(); return false;">

当然，如果您执行上述任一操作并且您的表单使用POST而不是GET（大多数表单都这样做），那么您是否从服务器上的相同源获取参数值将取决于服务器端机制你正在使用。例如，Java的ServletRequest#getParameter方法并不关心，它同时在GET和POST数据中查找，而对于其他一些技术，则绘制了更多区别。没问题，你只需要确定你是从正确的地方来的。

Answer 5

我建议您不要使用onclick="parentNode.submit();return false;"创建一个所有链接调用以执行提交的js函数。然后你可以使用隐藏字段或获取变量或其他任何东西来传输链接的id。

function submitMe(linkID)
{
    document.getElementById("hfWhichButtonSubmittedMe").value = linkID;
    document.getElementById(linkID).parentNode.submit();
    return false;
}

...

<a href="" id="mySubmitLink1" onclick="return submitMe('mySubmitLink1');">blah blah</a>

一个表单，多个提交按钮和提交链接

5 个答案: