Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Menukar HTML5 FormData kepada JSON Tanpa Serialisasi?

Bagaimana untuk Menukar HTML5 FormData kepada JSON Tanpa Serialisasi?

Susan Sarandon
Susan Sarandonasal
2024-10-26 14:26:02320semak imbas

How to Convert HTML5 FormData to JSON Without Serialization?

Menukar HTML5 FormData kepada JSON tanpa Serialisasi

Apabila bekerja dengan borang HTML5, mungkin timbul keperluan untuk menukar data borang kepada JSON. Satu pendekatan biasa adalah untuk mensiri objek FormData; bagaimanapun, ini mungkin tidak diingini dalam semua kes. Begini cara anda boleh menukar entri FormData kepada JSON tanpa bersiri:

Langkah 1: Lelaran pada Objek FormData

Gunakan kaedah forEach() untuk lelaran ke atas objek FormData entri. Setiap entri mengandungi kunci (nama medan) dan nilai (nilai input).

Langkah 2: Buat Objek Biasa

Mulakan objek kosong untuk menyimpan yang ditukar Data JSON.

Langkah 3: Tukar Entri kepada Pasangan Nilai Kunci

Dalam panggilan balik forEach(), tetapkan nilai pada objek berdasarkan kekuncinya. Contohnya:

<code class="javascript">formData.forEach(function(value, key) {
    object[key] = value;
});</code>

Langkah 4: Tukar Objek kepada JSON

Akhir sekali, gunakan kaedah JSON.stringify() untuk menukar objek kepada rentetan JSON.

<code class="javascript">var json = JSON.stringify(object);</code>

Menggunakan Fungsi Anak Panah ES6

Anda boleh memudahkan gelung forEach() menggunakan fungsi anak panah ES6:

<code class="javascript">formData.forEach((value, key) => object[key] = value);</code>

Menyokong Berbilang Nilai

Jika borang anda termasuk medan dengan berbilang nilai, seperti senarai berbilang pilihan, anda boleh mengubah suai kod di atas untuk menyokongnya:

<code class="javascript">formData.forEach((value, key) => {
    if (!Array.isArray(object[key])) {
        object[key] = [object[key]];
    }
    object[key].push(value);
});</code>

Menghantar FormData Terus

Jika matlamat anda adalah untuk menyerahkan data borang melalui XMLHttpRequest, anda boleh mempertimbangkan untuk menghantar objek FormData secara langsung tanpa menukarnya kepada JSON. Pendekatan ini turut disokong oleh API Ambil.

Mengendalikan Objek Kompleks

Perhatikan bahawa kaedah JSON.stringify() mungkin menghadapi had apabila berurusan dengan objek kompleks. Dalam kes sedemikian, pertimbangkan untuk mentakrifkan kaedah toJSON() dalam objek anda untuk menentukan logik siri tersuai.

Atas ialah kandungan terperinci Bagaimana untuk Menukar HTML5 FormData kepada JSON Tanpa Serialisasi?. 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