FormData()

FormData() コンストラクターは、新しい FormData オブジェクトを生成します。

Note: This feature is available in Web Workers.

構文

var formData = new FormData(form)

引数

form Optional
HTML の <form> 要素です。これが指定されたとき、FormData オブジェクトは、その各要素の name プロパティをキーに、それらの送信される値を値として使い、フォームの現在のキーと値が設定されます。ファイルからの入力内容は、エンコードもされます。

次の行は、空の FormData オブジェクトを生成します:

var formData = new FormData(); // Currently empty

FormData.append を使って、これにキーと値の組を追加することができます:

formData.append('username', 'Chris');

または、FormData オブジェクトを生成するときにオプションの form 引数を指定することにより、指定したフォームの値を設定することができます:

<form id="myForm" name="myForm">
  <div>
    <label for="username">Enter name:</label>
    <input type="text" id="username" name="username">
  </div>
  <div>
    <label for="useracc">Enter account number:</label>
    <input type="text" id="useracc" name="useracc">
  </div>
  <div>
    <label for="userfile">Upload file:</label>
    <input type="file" id="userfile" name="userfile">
  </div>
  <input type="submit" value="Submit!">
</form>

Note: 正しく選択されたフォーム コントロールだけが FormData に含まれます。つまり、name 属性を持ち、disabled ではなく、checked (ラジオボタンやチェックボックス) または selected (選択リストのひとつ以上のオプション) であるものです。

let myForm = document.getElementById('myForm');
let formData = new FormData(myForm);

仕様書

Specification Status Comment
XMLHttpRequest
FormData() の定義
現行の標準 Initial definition

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
FormData() constructorChrome 完全対応 7Edge 完全対応 ありFirefox 完全対応 4IE 完全対応 10Opera 完全対応 12Safari 完全対応 5WebView Android 完全対応 ありChrome Android 完全対応 ありFirefox Android 完全対応 ありOpera Android 完全対応 12Safari iOS ? Samsung Internet Android ?

凡例

完全対応  
完全対応
実装状況不明  
実装状況不明

関連情報