GlobalEventHandlers.onformdata

onformdataGlobalEventHandlers ミックスインのプロパティで、フォームのデータを表す項目リストが構築された後に発行される formdata イベントを処理するイベントハンドラー (EventHandler) です。これはフォームが送信されたときに発生しますが、 FormData() コンストラクターを呼び出しても発行することができます。 onformdataHTMLFormElement で利用できます。

構文

target.onclick = functionRef;

functionRef は関数名または 関数式です。この関数は唯一の引数として FormDataEvent オブジェクトを受け取ります。

// grab reference to form

const formElem = document.querySelector('form');

// submit handler

formElem.addEventListener('submit', (e) => {
  // on form submission, prevent default
  e.preventDefault();
 
  // construct a FormData object, which fires the formdata event
  new FormData(formElem);
});

// formdata handler to retrieve data

formElem.onformdata = (e) => {
  console.log('formdata fired');
 
  // Get the form data from the event object
  let data = e.formData;
  for (var value of data.values()) {
    console.log(value);
  }
 
  // submit the data via XHR
  var request = new XMLHttpRequest();
  request.open("POST", "/formHandler");
  request.send(data);
};

仕様書

仕様書 状態 備考
HTML Living Standard
onformdata の定義
現行の標準

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
onformdataChrome 完全対応 77Edge 完全対応 79Firefox 完全対応 72IE 未対応 なしOpera 完全対応 64Safari 未対応 なしWebView Android 完全対応 77Chrome Android 完全対応 77Firefox Android 未対応 なしOpera Android 完全対応 55Safari iOS 未対応 なしSamsung Internet Android 完全対応 12.0

凡例

完全対応  
完全対応
未対応  
未対応

関連情報