FormDataEvent
FormDataEvent
インターフェイスは formdata
イベントを表します。 — このようなイベントは HTMLFormElement
オブジェクトで、フォームデータを表すエントリーリストが構築された後に発行されます。これはフォームが送信されようとするときに発行されますが、 FormData()
コンストラクターの呼び出しでも発行させることができます。
これにより、 XMLHttpRequest
などのメソッドでフォームデータを送信する際に、自分で用意しなくても、 formdata
イベントの発行に応じて、 FormData
オブジェクトをすばやく取得することができます (FormData オブジェクトの使用を参照)。
コンストラクター
FormDataEvent()
-
新しい
FormDataEvent
オブジェクトインスタンスを生成します。
プロパティ
親インターフェイスである Event
からプロパティを継承しています。
FormDataEvent.formData
-
イベントが発行された時点のフォーム内に含まれるデータを表す
FormData
オブジェクトです。
メソッド
親インターフェイスである Event
からメソッドを継承しています。
例
// フォームの参照を得る
const formElem = document.querySelector('form');
// submit ハンドラー
formElem.addEventListener('submit', (e) => {
// on form submission, prevent default
e.preventDefault();
// FormData オブジェクトを構築し、 formdata イベントを発行させる
new FormData(formElem);
});
// データを受け取るための formdata ハンドラー
formElem.addEventListener('formdata', (e) => {
console.log('formdata fired');
// イベントオブジェクトからフォームデータを取得
let data = e.formData;
for (var value of data.values()) {
console.log(value);
}
// XHR を通じてデータを送信
var request = new XMLHttpRequest();
request.open("POST", "/formHandler");
request.send(data);
});
仕様書
Specification |
---|
HTML Standard # the-formdataevent-interface |
ブラウザーの互換性
BCD tables only load in the browser