迹忆客 专注技术分享

本教程将讨论如何使用 JavaScript 中的 submit() 函数提交表单。

通过单击链接并使用 JavaScript 中的 submit() 函数提交表单

在 JavaScript 中，你可以使用 form 标签创建一个表单，你可以使用 id 属性给表单一个 id，之后，你必须选择一种提交表单的方法，你可以提交表单单击链接或按钮时。现在，有两种提交表单的方法，你可以使用 onclick 属性在 HTML 代码中执行此操作，也可以在 JavaScript 中执行此操作。例如，让我们使用 onclick 属性在 HTML 中提交一个表单。请参考下面的代码。

<form id="FormId">
  <a href="FormLink" id = "LinkID" onclick="document.getElementById('FormId').submit();"> SubmitForm </a>
</form>

你可以根据需要更改上述代码中的 form ID 和链接 ID。不推荐使用此方法，因为你将 HTML 与 JavaScript 代码混合在一起。你还可以通过使用表单和链接的 id 在 JavaScript 中单独执行此操作。例如，让我们使用单独的 JavaScript 进行上述操作。请参考下面的代码。

var myform = document.getElementById('FormId');
document.getElementById('LinkId').addEventListener('click', function() {
  myform.submit();
});

建议使用此方法，因为 HTML 和 JavaScript 位于不同的文件中。请注意，你必须使用在 HTML 中定义的表单 id 和链接 id 才能在 JavaScript 中获取这些元素。单击链接时将提交表单。

通过单击按钮并使用 JavaScript 中的 submit() 函数提交表单

你可以使用按钮提交表单。提交表单有两种方法，你可以使用 onclick 属性在 HTML 代码中执行此操作，也可以在 JavaScript 中执行此操作。例如，让我们使用 onclick 属性在 HTML 中提交一个表单。请参考下面的代码。

<form id="FormId">
  <button id = "ButtonId" onclick="document.getElementById('FormId').submit();"> SubmitForm </button>
</form>

与上述方法类似，不推荐使用此方法，因为你将 HTML 与 JavaScript 代码混合。让我们使用单独的 JavaScript 来完成上述操作。

var myform = document.getElementById('FormId');
document.getElementById('ButtonId').addEventListener('click', function() {
  myform.submit();
});