Bagaimana Menggunakan AJAX dan FormData untuk Muat Naik Fail?

Muat Naik Fail AJAX dengan FormData

Dalam konteks HTML dinamik, anda telah menghasilkan borang muat naik fail melalui drag-and-drop dan mempunyai kod JavaScript untuk menyerahkan borang menggunakan AJAX. Walau bagaimanapun, untuk memudahkan muat naik fail menggunakan FormData, anda memerlukan pelarasan.

Persediaan

Untuk menggunakan FormData, pilih salah satu daripada yang berikut:

• Bekalkan keseluruhan borang untuk pemprosesan:

var form = $('form')[0];
var formData = new FormData(form);

• Nyatakan data tepat untuk FormData:

var formData = new FormData();
formData.append('section', 'general');
formData.append('action', 'previewImg');
// Attach file
formData.append('image', $('input[type=file]')[0].files[0]);

Menghantar Borang

Gunakan coretan jQuery yang disediakan:

$.ajax({
    url: 'Your url here',
    data: formData,
    type: 'POST',
    contentType: false,
    processData: false,
    // ... Other options like success and etc
});

Permintaan ini akan meniru penyerahan borang biasa dengan enctype="multipart/form-data", membolehkan anda memuat naik fail dengan jayanya.

Nota: Ingat untuk menyatakan jenis: "POST" dalam pilihan, sebagai muat naik fail memerlukan permintaan POST.

Kemas kini: Bermula dengan jQuery 1.6, contentType: false disokong.

Atas ialah kandungan terperinci Bagaimana Menggunakan AJAX dan FormData untuk Muat Naik Fail?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!