使用Ajax / XMLhttprequest通過郵件功能將數據發送到php文件

Question

我一直在關注本教程（ https://developer.mozilla.org/en-US/docs/AJAX/Getting_Started ），但是我沒有運氣。 我正在嘗試使用XMLhttpRequest與帶有javascript文件的php文件進行通信。 這是下面的代碼。 我仍然不明白如何完全傳輸數據。

HTML

form id="uDF" method="post" onsubmit="submitValidation()">

JavaScript的

function submitValidation(){
var data = [document.forms ["uDF"] ["uDFName"].value, document.forms ["uDF"] ["uDFNumber"].value,
document.forms ["uDF"] ["uDFEmail"].value, document.forms ["uDF"] ["uDFSubject"].value,
document.forms ["uDF"] ["uDFMessage"].value,]
console.log(data);
var char = ''; // variable used to check whether email has @
var x;
var isEmail = false;
var isNotEmpty = false;

//for loop checks email for @ char
for(x = 0; x<data[2].length;x++)
{
    char = data[2].charAt(x);
    if(char === "@"){
        isEmail = true;
        break;
    }
}

var i;

//for loop check if data is collected
for(i=0;i < 5;i++){
    if(data[i] === ""){
        isNotEmpty = false;
    }else{
        isNotEmpty = true;
    }
}
if(isEmail === true && isNotEmpty === true)
{
    var httpRequest;
    httpRequest = new XMLHttpRequest();
    if(!httpRequest){
        return false;
    }
    httpRequest.onreadystatechange = function(){
        if(httpRequest.readyState === XMLHttpRequest.DONE && httpRequest.status === 200)
        {
            var response = JSON.parse(httpRequest.responseText);
        }
        httpRequest.open('POST', '../userData.mail.php')
        httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
        httpRequest.send('uDFName=' + encodeURIComponent(data[0]) + 'uDFNumber=' + encodeURIComponent(data[1]) + 'uDFNumber=' + encodeURIComponent(data[3])
            + 'uDFNumber=' + encodeURIComponent(data[4]))
    }
}else if (!isNotEmpty){
    alert("empty fields");
}else if(!isEmail){
    alert("Please enter valid email!");
}

}

PHP

$uDFName = (isset($_POST['uDFName'])) ? $_POST['uDFName'] : '';
$uDFNumber = (isset($_POST['uDFNumber'])) ? $_POST['uDFNumber'] : '';
$uDFEmail = "my@email";
$uDFSubject = (isset($_POST['uDFSubject'])) ? $_POST['uDFSubject'] : '';
$uDFMessage = $uDFName . "\r\n" . $uDFNumber . "\r\n" . "just testing";


$message = wordwrap($message, 70, "\r\n");
mail($uDFEmail, $uDFSubject, $uDFMessage);

Answer 1

您必須在事件處理程序功能之外打開並發送請求。 僅當您的請求的就緒狀態發生更改時，才會執行onreadystatechange處理程序。

如果您不打開並發送請求，則處理程序功能將不會執行，並且不會看到任何結果。

該解決方案應該起作用：

var httpRequest = new XMLHttpRequest();

// this function executes whenever the ready state of the request changes
httpRequest.onreadystatechange = function () {
    if (httpRequest.readyState === XMLHttpRequest.DONE && httpRequest.status === 200) {
        var response = JSON.parse(httpRequest.responseText);
    }
}

// open the request ...
httpRequest.open('POST', '../userData.mail.php')
httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');

// ... and send it
httpRequest.send('uDFName=' + encodeURIComponent(data[0]) + 'uDFNumber=' + encodeURIComponent(data[1]) + 'uDFNumber=' + encodeURIComponent(data[3])
        + 'uDFNumber=' + encodeURIComponent(data[4]));