javascript - FormData 値へのアクセス

Question

そのようなフォームjavascriptから作成する FormData オブジェクトがあります。HTMLこのFormDataオブジェクトは十分に文書化されていないようです (私が間違ったものを探しているだけかもしれません!)。

var form = new FormData(document.getElementById("form"));

私の質問

FormDataこのオブジェクトを送信する前に、このオブジェクトのさまざまな入力値にアクセスするにはどうすればよいですか? 例えば。form.namename の入力に入力された値にアクセスしますform.name。

score 26 · Accepted Answer

を使用してフォーム要素の値を取得できないようですFormData。

このFormDataオブジェクトを使用すると、一連のキーと値のペアをコンパイルして、XMLHttpRequest を使用して送信できます。主にフォームデータの送信に使用することを目的としていますが、キー付きデータを送信するためにフォームとは別に使用できます。送信されるデータは、フォームのエンコーディングタイプが「multipart/form-data」に設定されている場合に、フォームの submit() メソッドがデータの送信に使用するのと同じ形式です。

ただし、このような単純なJavascriptを使用して実現できます

var formElements = document.forms['myform'].elements['inputTypeName'].value;

score 16 · Accepted Answer

FormData.getは、ブラウザーの小さなサブセットで必要なことを行います。ブラウザーの互換性チャートを見て、どのブラウザーかを確認してください (現在、Chrome 50 以降と Firefox 39 以降のみ)。このフォームを考えると：

<form id="form">
  <input name="inputTypeName">
</form>

経由でその入力の値にアクセスできます

var form = new FormData(document.getElementById("form"));
var inputValue = form.get("inputTypeName");

score 10 · Accepted Answer

MDNによると:

FormData を実装するオブジェクトは、entries() の代わりに for...of 構造体で直接使用できます。 for (var p of myFormData) は for (var p of myFormData.entries()) と同等です。

したがって、次のように FormData 値にアクセスできます。

var formData = new FormData(myForm);

for (var p of formData) {
    let name = p[0];
    let value = p[1];

    console.log(name, value)
}

javascript - FormData 値へのアクセス

11 に答える 11

Related

Reference