HTML 表单上的默认提交按钮是如何确定的？

小编典典

HTML 表单上的默认提交按钮是如何确定的？

all

如果表单已提交但不是通过任何特定按钮提交，例如

按Enter
HTMLFormElement.submit()在 JS 中使用

浏览器应该如何确定多个提交按钮中的哪一个（如果有）用作按下的按钮？

这在两个层面上很重要：

调用onclick附加到提交按钮的事件处理程序
发送回网络服务器的数据

到目前为止，我的实验表明：

按下时Enter，Firefox、Opera 和 Safari 使用表单中的第一个提交按钮
按下时Enter，IE 使用第一个提交按钮或根本不使用，具体取决于我无法弄清楚的条件
所有这些浏览器都不使用任何 JS 提交

标准是怎么说的？

如果有帮助，这是我的测试代码（PHP 仅与我的测试方法相关，与我的问题本身无关）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Test</title>
</head>

<body>

<h1>Get</h1>
<dl>
<?php foreach ($_GET as $k => $v) echo "<dt>$k</dt><dd>$v</dd>"; ?>
</dl>

<h1>Post</h1>
<dl>
<?php foreach ($_POST as $k => $v) echo "<dt>$k</dt><dd>$v</dd>"; ?>
</dl>

<form name="theForm" method="<?php echo isset($_GET['method']) ? $_GET['method'] : 'get'; ?>" action="<?php echo $_SERVER['SCRIPT_NAME']; ?>">
    <input type="text" name="method" />
    <input type="submit" name="action" value="Button 1" onclick="alert('Button 1'); return true" />
    <input type="text" name="stuff" />
    <input type="submit" name="action" value="Button 2" onclick="alert('Button 2'); return true" />
    <input type="button" value="submit" onclick="document.theForm.submit();" />
</form>

</body></html>

阅读 95

2022-06-04

共1个答案

小编典典

如果您通过 JavaScript（即，formElement.submit()或任何等效方法）提交表单，则没有
一个提交按钮被认为是成功的，并且它们的值都不包含在提交的数据中。（请注意，如果您通过使用提交表单，submitElement.click()那么您引用的提交被认为是活动的；这并不真正属于您的问题范围，因为这里的提交按钮是明确的，但我想我会包括它对于阅读了第一部分并想知道如何通过
JavaScript 表单提交使提交按钮成功的人。当然，表单的 onsubmit
处理程序仍然会以这种方式触发，而他们不会通过form.submit()，所以这是另一锅鱼......）

如果表单是通过在非文本区域字段中按 Enter
提交的，那么实际上由用户代理来决定它想要什么。规范没有说明Enter在文本输入字段中使用键提交表单（如果您选择按钮并使用空格或其他方式激活它，那么没有问题，因为明确使用了特定的提交按钮）。它只是说激活提交按钮时必须提交表单。甚至不需要Enter输入例如文本输入来提交表单。

我相信 Internet Explorer 选择了源中最先出现的提交按钮；我有一种感觉，Firefox 和 Opera 选择具有最低 tabindex
的按钮，如果没有定义其他内容，则回退到第一个定义的按钮。关于提交是否具有非默认值属性 IIRC 也存在一些复杂性。

要带走的一点是，这里发生的事情没有定义的标准，这完全是浏览器的心血来潮 -
所以无论你在做什么，尽量避免依赖任何特定的行为。如果您真的必须知道，您可能会发现各种浏览器版本的行为，但是当我不久前对此进行调查时，有一些非常复杂的情况（当然会随着新的浏览器版本而改变），我会建议您尽可能避免！

2022-06-04