Bagaimana untuk Menghantar Data FormData dan String Secara serentak dalam JQuery AJAX?

Menghantar Data Borang dan String Secara Serentak dalam JQuery AJAX

Apabila bekerja dengan borang yang melibatkan muat naik fail, adalah perlu untuk menggabungkan data fail dengan tambahan data rentetan untuk diserahkan kepada pelayan. Begini cara untuk mencapai ini menggunakan FormData() dalam JQuery AJAX:

Membina FormData dengan Data Fail dan Rentetan:

<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>

Menyerahkan Data Menggunakan AJAX:

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

Penjelasan:

• serializeArray(): Kaedah ini mendapatkan semula data borang sebagai tatasusunan objek, memberikan kawalan yang lebih baik ke atas setiap nama dan nilai input.
• contentType: false dan processData: false: Tetapan ini melumpuhkan pemprosesan data lalai JQuery dan membenarkan FormData mentah dihantar ke pelayan.
• 'submit.php': Gantikan ini dengan URL skrip sebelah pelayan yang akan mengendalikan fail dan data rentetan.

Pertimbangan Sebelah Pelayan:

Untuk mendapatkan semula fail dan data rentetan pada pelayan, anda boleh menggunakan kod berikut:

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

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

Atas ialah kandungan terperinci Bagaimana untuk Menghantar Data FormData dan String Secara serentak dalam JQuery AJAX?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!