Rumah  >  Artikel  >  pembangunan bahagian belakang  >  Bagaimana untuk Menghantar Data FormData dan String Secara serentak Menggunakan JQuery AJAX?

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

Susan Sarandon
Susan Sarandonasal
2024-10-22 14:27:02585semak imbas

How to Simultaneously Transmit FormData and String Data Using JQuery AJAX?

Penghantaran Serentak FormData dan Data Rentetan Menggunakan JQuery AJAX

Untuk menghantar kedua-dua fail dan data rentetan menggunakan FormData(), pertimbangkan pendekatan berikut :

Buat objek FormData baharu:

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

Untuk berbilang fail, dapatkan semula fail yang dipilih daripada input fail:

<code class="javascript">var file_data = $('input[type="file"]')[0].files;</code>

Gelung fail dan tambahkan mereka ke FormData menggunakan nama unik untuk setiap fail:

<code class="javascript">for(var i = 0;i<file_data.length;i++){
    fd.append("file_"+i, file_data[i]);
}</code>

Seterusnya, dapatkan semula data input bukan fail menggunakan jQuery's .serializeArray():

<code class="javascript">var other_data = $('form').serializeArray();</code>

Lelaran melalui bukan -failkan data input dan tambahkannya pada FormData menggunakan .append():

<code class="javascript">$.each(other_data,function(key,input){
    fd.append(input.name,input.value);
});</code>

Akhir sekali, konfigurasikan permintaan AJAX dengan FormData sebagai muatan data:

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

Dengan mengikuti langkah-langkah ini, anda boleh menghantar kedua-dua fail dan data rentetan secara berkesan secara serentak melalui FormData dan JQuery AJAX, memastikan semua maklumat yang diperlukan dihantar ke pelayan.

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

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn