From e7558a60eb9de82f984b2f30df55fc6a8b48ae11 Mon Sep 17 00:00:00 2001 From: Masahiro FUJIMOTO Date: Mon, 19 Jul 2021 01:08:24 +0900 Subject: Web/API/FormDataEvent を新規翻訳 (#1489) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 2021/07/11 時点の英語版に基づき新規翻訳 --- files/ja/web/api/formdataevent/formdata/index.html | 75 ++++++++++++++++++++++ 1 file changed, 75 insertions(+) create mode 100644 files/ja/web/api/formdataevent/formdata/index.html (limited to 'files/ja/web/api/formdataevent/formdata/index.html') diff --git a/files/ja/web/api/formdataevent/formdata/index.html b/files/ja/web/api/formdataevent/formdata/index.html new file mode 100644 index 0000000000..0e8e0bb711 --- /dev/null +++ b/files/ja/web/api/formdataevent/formdata/index.html @@ -0,0 +1,75 @@ +--- +title: FormDataEvent.formData +slug: Web/API/FormDataEvent/formData +tags: +- API +- Experimental +- FormDataEvent +- Forms +- Property +- Reference +browser-compat: api.FormDataEvent.formData +translation_of: Web/API/FormDataEvent/formData +--- +
{{APIRef("DOM")}}
+ +

formData は {{domxref("FormDataEvent")}} インターフェイスの読み取り専用プロパティで、このイベントが発行された時点のフォームに含まれていたデータを表す {{domxref("FormData")}} オブジェクトが入っています。

+ +

構文

+ +
formData = formDataEvent.formData
+ +

返値

+ +

{{domxref("FormData")}} オブジェクト

+ +

+ +
// フォームの参照を取得
+
+const formElem = document.querySelector('form');
+
+// submit ハンドラー
+
+formElem.addEventListener('submit', (e) => {
+  // フォームの送信時、既定の動作を抑止
+  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);
+});
+ +

仕様書

+ +{{Specifications}} + +

ブラウザーの互換性

+ +

{{Compat}}

+ +

関連情報

+ + -- cgit v1.2.3-54-g00ecf