as Objekt @FormData () fügt keine Eingaben vom Typ "Senden" aus dem Formular hinzu, während in Firefox
Heute bin ich auf einen interessanten Fehler gestoßen, der eine Menge Zeit in Anspruch nahm, um auf den Grund zu gehen.
Die Einrichtun Ein Formular auf einer Seite. Beim Absenden werden die Daten erfasst undnew FormData()
Objekt wird damit erstellt.
Das Objekt wird mit und @ gesendxhr
Anfrage an ein.php
script, das dann ein @ zurückgiok
/ error
Botschaft
Der Code sieht ungefähr so aus: vereinfachte Version, keine Notwendigkeit für Flusen)
<form name="frm" id="frm" action="" method="post" onsubmit="save(event, this);" enctype="multipart/form-data">
<input name="name" id="name" type="text" value="..." />
<input name="email" id="email" type="text" value="..." />
<input name="phone" id="phone" type="text" value="..." />
<input name="website" id="website" type="text" value="..." />
<textarea name="details" id="details"></textarea>
<input name="send" type="submit" value="Send" />
</form>
<script type="text/javascript">
function save(e, frm) {
if (document.getElementById('nume').value == '' ||
document.getElementById('email').value == '' ||
document.getElementById('telefon').value == '' ||
document.getElementById('site').value == '') {
alert('Forms empty');
} else {
var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
xhr.onreadystatechange = function () {
if (xhr.readyState == 4) {
var r = JSON.parse(xhr.responseText);
if (r.code == 0) {
document.getElementById('message_ok').style.display = 'block';
} else {
document.getElementById('message_err').style.display = 'block';
}
}
};
xhr.open('POST', 'http://url', true);
var data = new FormData(frm);
xhr.send(data);
}
e.preventDefault();
}
</script>
Senden Sie dies an.php
ergibt ein Array, das ungefähr so aussieht:
Array
(
[name] => some name
[email] => some email
[phone] => 11111111
[website] => some site
[details] => some details
[send] => Send
)
und.php
antwortet entweder mit{"message":"ok","code":0}
oder{"message":"error","code":1}
Now das ist das erwartete Verhalten. Dies ist, was ich entweder auf Chrome, IE oder Safari bekomme.
Das Probleei Firefox erhalte ich jedoch das gleiche Array, außer ohne dassubmit
input name="send"
) Schlüssel / Wert-Paar:
Array
(
[name] => some name
[email] => some email
[phone] => 11111111
[website] => some site
[details] => some details
)
Ich habe sowohl unter Linux als auch unter Windows versucht, meine Basis zu decken, aber es ergab immer noch das gleiche unbefriedigende Ergebnis.
LösunNachdem ich online gesucht habe und leer bin, wie ich es gelöst habe mehr Patchen, nicht wirklich lösen) sollte das @ überschreibsend
Schlüsselwert
var data = new FormData(frm);
data.append('send', 'Send');
xhr.send(data);
Dies funktioniert, denn wenn es bereits definiert ist Chrome, etc ...) es wird überschrieben, wenn es nicht existiert, wird es erzeugt.
FrageÄhnlic - Hast du jemals mit etwas Ähnlichem konfrontiert?Fi - Ich betrachte meine Lösung als Hack. Haben Sie Ideen für eine bessere Lösung?