Heim > Artikel > Web-Frontend > Wie konvertiert man HTML5-Formdaten in JSON ohne jQuery oder Serialisierung?
HTML5-Formulardaten in JSON konvertieren: Eine Schritt-für-Schritt-Anleitung
Problem:Konvertieren der Einträge von a FormData-Objekt in JSON ohne jQuery oder Serialisierung des gesamten Objekts.
Antwort:
Um die Einträge eines FormData-Objekts in JSON zu konvertieren, befolgen Sie diese Schritte:
Beispiel für die Verwendung von forEach :
<code class="js">var object = {}; formData.forEach(function(value, key){ object[key] = value; }); var json = JSON.stringify(object);</code>
Beispiel für die Verwendung von ES6-Pfeilfunktionen:
<code class="js">var object = {}; formData.forEach((value, key) => object[key] = value); var json = JSON.stringify(object);</code>
Unterstützung für Mehrfachauswahllisten:
Wenn Ihr Formular Mehrfachauswahllisten oder andere Elemente mit mehreren Werten enthält, können Sie den folgenden Ansatz verwenden:
<code class="js">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); });</code>
Formulardaten an einen Server senden:
Wenn Sie beabsichtigen, die Formulardaten an einen Server zu senden, können Sie die Konvertierung in JSON überspringen und das FormData-Objekt direkt über eine XMLHttpRequest- oder Fetch-API-Anfrage senden.
Achtung:
Die Methode JSON.stringify() unterstützt möglicherweise nicht alle Objekttypen. Wenn Ihr Objekt nicht unterstützte Typen enthält, müssen Sie möglicherweise eine benutzerdefinierte toJSON()-Methode implementieren, um die Serialisierungslogik anzugeben.
Das obige ist der detaillierte Inhalt vonWie konvertiert man HTML5-Formdaten in JSON ohne jQuery oder Serialisierung?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!