我尝试通过XMLHttpRequest将HTML表单中的数据发送到服务器。问题是，在服务器端通过PHP我无法访问数据。
我总是以responseText的身份返回：
[Anfrageerhältkeinen EntleiherLang-
[Anfrageerhältkeinen StartDatum-
[Anfrageerhältkeinen EndeDatum-
发送请求后，如果我进入网络分析，发现参数send设置为
[object HTMLFormElement]
在我看来，这行代码：
var formData = new FormData();
var formData = document.querySelector("#NeueDaten");
并没有真正将表单数据转换为FormData格式。
这里是HTML端：
<script>
$('#NeueDaten').submit(function(e){
e.preventDefault();
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
console.log(xhttp.responseText);
}
};
xhttp.open("POST", "NeueEntleihung.php", true);
var formData = new FormData();
var formData = document.querySelector("#NeueDaten");
xhttp.setRequestHeader("X-Test","test2");
xhttp.send(formData);
});
</script> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html style="background-image:none;">
<head>
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/plain"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
</head>
<body style="width: 80%;padding: 5%; padding-top:0; margin:auto;">
<form id="NeueDaten" name="foorm" action="">
<input type="text" name="NeuerEntleiherLang">
<input type="date" name="StartDatum" >
<input type="date" name="EndeDatum" >
<input type="submit" name="SubmitButton">
</form> 这里是PHP
<?php
header("Content-type: text/HTML");
$responseText = '';
if(!isset($_POST['EntleiherLang'])) {
$responseText = 'Anfrage erhält keinen EntleiherLang -- ';
} else {
$responseText = "EntleiherLang: " .$_POST['EntleiherLang'] ." --" ;
}
if(!isset($_POST['StartDatum'])) {
$responseText = $responseText.'Anfrage erhält keinen StartDatum --';
} else {
$responseText = $responseText ."StartDatum: " .$_POST['StartDatum'] ." --" ;
}
if(!isset($_POST['EndeDatum'])) {
$responseText = $responseText.'Anfrage erhält keinen EndeDatum -- ';
} else {
$responseText = $responseText ."EndeDatum: " .$_POST['EndeDatum'] ." --" ;
}
header($_SERVER['SERVER_PROTOCOL'].' '.$responseStatus);
header('Content-type: text/html; charset=utf-8');
echo $responseText;
?>
尝试将表单元素作为参数传递给FormData对象：
$('#NeueDaten').submit(function(e) {
e.preventDefault();
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
console.log(xhttp.responseText);
}
};
xhttp.open("POST", "NeueEntleihung.php", true);
var formData = new FormData(document.querySelector("#NeueDaten"));
xhttp.setRequestHeader("X-Test", "test2");
xhttp.send(formData);
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="NeueDaten" name="foorm" action="">
<input type="text" name="NeuerEntleiherLang">
<input type="date" name="StartDatum" >
<input type="date" name="EndeDatum" >
<input type="submit" name="SubmitButton">
</form>[您可以使用jQuery发送Ajax帖子，这将使其更具可读性和简洁性