SubmitEvent

SubmitEvent()

type と他のオプションが指定された SubmitEvent オブジェクトを新しく作成して返します。現在、SubmitEvent の有効な type は submit だけであることに注意してください。

以下のプロパティに加えて、このインターフェイスには親インターフェイスである Event から継承したプロパティがあります。

submitter 読取専用

フォーム送信のきっかけとなったボタンやその他の要素を特定する HTMLElement オブジェクトです。

SubmitEvent には自身のメソッドがありませんが、親インターフェイスである Event から継承したメソッドがあります。

この例では、ユーザーの設定、店舗の設定、決済業者によって確立された商品券の合計額の最小値または最大値等の要因に応じて、ショッピングカートに様々な組み合わせの送信ボタンが表示される可能性があります。それぞれの送信要素の id で、ボタンに対応する決済業者を識別します。

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 を渡しながら注文を処理することができます。