表单：事件和方法提交

当表单提交时，submit 事件触发，通常用于在将表单发送到服务器之前对其进行验证，或中止提交并在 JavaScript 中对其进行处理。

方法 form.submit() 允许从 JavaScript 发起表单发送。我们可以使用它来动态创建并向服务器发送我们自己的表单。

让我们看看它们的更多详细信息。

事件：提交

有两种主要方法可以提交表单

1. 第一种 - 单击 <input type="submit"> 或 <input type="image">。
2. 第二种 - 在输入字段中按 Enter。

这两种操作都会导致表单上的 submit 事件。处理程序可以检查数据，如果存在错误，则显示它们并调用 event.preventDefault()，然后表单将不会发送到服务器。

在下面的表单中

1. 进入文本字段并按 Enter。
2. 单击 <input type="submit">。

由于 return false，这两个操作都显示 alert，并且表单不会发送到任何地方

<form onsubmit="alert('submit!');return false">
  First: Enter in the input field <input type="text" value="text"><br>
  Second: Click "submit": <input type="submit" value="Submit">
</form>

<form onsubmit="return false">
 <input type="text" size="30" value="Focus here and press enter">
 <input type="submit" value="Submit" onclick="alert('click')">
</form>

方法：submit

若要手动向服务器提交表单，我们可以调用 form.submit()。

然后不会生成 submit 事件。假设如果程序员调用 form.submit()，则脚本已经完成了所有相关处理。

有时会使用它来手动创建和发送表单，如下所示

let form = document.createElement('form');
form.action = 'https://google.com/search';
form.method = 'GET';

form.innerHTML = '<input name="q" value="test">';

// the form must be in the document to submit it
document.body.append(form);

form.submit();