👌
Event.preventDefault()で止めたフォームの送信を再開する
初めに結論
HTMLFormElement.submit()
を実行する。
const form = document.getElementById('form');
form.addEventListener('submit', event => {
// イベントを停止する
event.preventDefault();
// なんかの処理
// 改めてsubmitする
form.submit();
});
HTMLFormElement.submit()
は Event.preventDefault()
で処理止まらないの?
submit イベントは、ユーザーが送信ボタン (<button> または <input type="submit">) を押したり、 Enter キーをフォーム内のフィールド (例えば <input type="text">) の編集中に押したりしたときに発生します。このイベントは form.submit() メソッドを呼び出した場合には送信されません。
HTMLFormElement.submit()
を実行した場合、そもそも submit イベントが発生しないので、addEventListener で登録したコールバック関数は実行されずに、サーバーへの送信が行われます。
Discussion