ホームページ  >  記事  >  バックエンド開発  >  JQuery AJAX で FormData と文字列データを同時に送信するにはどうすればよいですか?

JQuery AJAX で FormData と文字列データを同時に送信するにはどうすればよいですか?

Patricia Arquette
Patricia Arquetteオリジナル
2024-10-22 14:20:03958ブラウズ

How to Send FormData and String Data Simultaneously in JQuery AJAX?

JQuery AJAX で FormData と String データを同時に送信する

ファイルのアップロードを伴うフォームを操作する場合、ファイル データと追加のデータを組み合わせる必要があります。サーバーに送信するための文字列データ。 JQuery AJAX で FormData() を使用してこれを実現する方法は次のとおりです。

ファイルと文字列データを使用して FormData を構築する:

<code class="javascript">// Create a new FormData object
var fd = new FormData();

// Append file data
for (var i = 0; i < file_data.length; i++) {
  fd.append("file_" + i, file_data[i]);
}

// Append other string data using serializeArray()
var other_data = $('form').serializeArray();
$.each(other_data, function (key, input) {
  fd.append(input.name, input.value);
});</code>

を使用してデータを送信するAJAX:

<code class="javascript">$.ajax({
  url: 'submit.php',
  data: fd,
  contentType: false,
  processData: false,
  type: 'POST',
  success: function (data) {
    console.log(data);
  },
});</code>

説明:

  • serializeArray(): このメソッドはフォーム データを配列として取得します
  • contentType: false および processData: false: これらの設定は、JQuery のデフォルトのデータ処理を無効にし、生の FormData を送信できるようにします。
  • 'submit.php': これを、ファイルと文字列データを処理するサーバー側スクリプトの URL に置き換えます。

サーバー側の考慮事項:

サーバー上のファイルと文字列データを取得するには、次のコードを使用できます:

<code class="php">// Files
print_r($_FILES);

// Other data
print_r($_POST);</code>

以上がJQuery AJAX で FormData と文字列データを同時に送信するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。