Bagaimana untuk Menukar Entri FormData HTML5 ke JSON tanpa jQuery?

Menukar Entri HTML5 FormData kepada JSON

Menukar entri HTML5 FormData kepada JSON adalah penting apabila bekerja dengan data borang dan menghantarnya ke titik akhir pelayan atau API. Berikut ialah penyelesaian yang tidak bergantung pada jQuery atau bersiri:

var object = {};
formData.forEach(function(value, key){
    object[key] = value;
});
var json = JSON.stringify(object);

Untuk meningkatkan kebolehbacaan dan kepekatan, anda boleh menggunakan fungsi anak panah ES6:

var object = {};
formData.forEach((value, key) => object[key] = value);
var json = JSON.stringify(object);

Mengendalikan Berbilang Nilai Elemen Borang:

Jika anda perlu menyokong senarai berbilang pilihan atau elemen borang lain dengan berbilang nilai, anda boleh mengembangkan penyelesaian seperti berikut:

var object = {};
formData.forEach((value, key) => {
    if(!Reflect.has(object, key)){
        object[key] = value;
        return;
    }
    if(!Array.isArray(object[key])){
        object[key] = [object[key]];    
    }
    object[key].push(value);
});
var json = JSON.stringify(object);

Terus Penyerahan ke Pelayan tanpa Penukaran:

Jika matlamat anda adalah untuk menyerahkan FormData ke pelayan, anda boleh memintas langkah penukaran JSON dan terus menghantar objek FormData itu sendiri melalui Ajax atau Fetch API:

var request = new XMLHttpRequest();
request.open('POST', 'http://example.com/submitform.php');
request.send(formData);

fetch('http://example.com/submitform.php', {
  method: 'POST',
  body: formData
}).then((response) => { 
  // Handle server response here... 
});

Pertimbangan untuk Objek Tidak Boleh Bersiri:

Ingat bahawa kaedah rentetan JSON mungkin tidak mengendalikan semua jenis objek tanpa penyesuaian tambahan. Jika anda menghadapi masalah dengan penyirian objek, anda boleh menentukan kaedah toJSON() anda sendiri pada objek untuk menentukan tingkah laku penyirian yang diingini.

Atas ialah kandungan terperinci Bagaimana untuk Menukar Entri FormData HTML5 ke JSON tanpa jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!