更新せずにファイルをアップロードするのは一般的ですが、やや複雑な問題です。一般的な解決策は、iframe を構築することです。
FormData オブジェクト API は HTML5 で提供されます。FormData を通じて、フォーム リクエストを簡単に作成し、XMLHttpRequest を通じて送信できます。 FormData オブジェクトを通じてファイルを送信することもできるため、更新せずにアップロードすることが非常に簡単になります。
それでは、FormData をどのように使用するのでしょうか?以下、Bangkejia がこれについて簡単に紹介します。
1. FormData オブジェクトを構築します
FormData オブジェクトを取得したい場合は、非常に簡単です:
FormData オブジェクトは、フォーム リクエスト パラメーターをオブジェクトに追加するために使用される append メソッドを 1 つだけ提供します。
現在主流のブラウザでは、次の 2 つの方法で FormData を取得または変更できます。
方法 1: 空の FormData オブジェクトを作成し、append メソッドを使用してキーと値のペアを 1 つずつ追加します。例:
このメソッドでは、HTML フォーム オブジェクトの存在は必要ありません。
方法 2: フォーム要素オブジェクトを取得し、それをパラメーターとして FormData オブジェクトに渡します。例:
もちろん、append メソッドを使用して他のパラメータを fd に追加し続けることもできます。
2. FormData がリクエストを送信します
FormData オブジェクトができたので、リクエストを送信するにはどうすればよいでしょうか? FormData オブジェクトは主に、拡張された XMLHttpRequest オブジェクトの send メソッドで使用されます。次の例を参照してください:
3. jquery で FormData を使用する
jQuery の ajax メソッドでは、FormData メソッドを使用して更新なしのアップロードを実現することもできます。ただし、パラメータ設定には注意してください。以下を参照してください:
4. 完全な例 (PHP 処理の例を含む):