SubmitEvent
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2021年9月以降、すべてのブラウザーで利用可能です。
SubmitEvent インターフェイスは、 HTML フォームの submit イベントを表現するために使用されるオブジェクトを定義します。このイベントは、フォームの送信操作が呼び出されたときに <form> で発行されます。
コンストラクター
SubmitEvent()-
typeと他のオプションが指定されたSubmitEventオブジェクトを新しく作成して返します。現在、SubmitEventの有効なtypeはsubmitだけであることに注意してください。
プロパティ
以下のプロパティに加えて、このインターフェイスには親インターフェイスである Event から継承したプロパティがあります。
submitter読取専用-
フォーム送信のきっかけとなったボタンやその他の要素を特定する
HTMLElementオブジェクトです。
メソッド
SubmitEvent には自身のメソッドがありませんが、親インターフェイスである Event から継承したメソッドがあります。
例
この例では、ユーザーの設定、店舗の設定、決済業者によって確立された商品券の合計額の最小値または最大値等の要因に応じて、ショッピングカートに様々な組み合わせの送信ボタンが表示される可能性があります。それぞれの送信要素の id で、ボタンに対応する決済業者を識別します。
js
let form = document.querySelector("form");
form.addEventListener("submit", (event) => {
let submitter = event.submitter;
let handler = submitter.id;
if (handler) {
processOrder(form, handler);
} else {
showAlertMessage(
"不明または未対応の支払い方法が選択されました。やり直してください。",
"OK",
);
}
});
ハンドラー ID は、 submit イベントの submitter プロパティを使用して送信ボタンを取得し、そこから ID を取得します。これで、 processOrder() 関数を呼び出して、フォームとハンドラー ID を渡しながら注文を処理することができます。
仕様書
| 仕様書 |
|---|
| HTML> # the-submitevent-interface> |