使用 JS（不是 jQuery）将表单数据发送到 PHP 页面

Question

如何在JS（不是jQuery）中以Ajax发送表单数据：

<form>
    <input name="name">
    <input name="age">
    <button type="submit">Send</button>
</form>

到目前为止我尝试过的：

await fetch('assets/php/ajax/login.php', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json'
    },
    body: JSON.stringify(data)
});

如何将表单数据获取到我的数据变量？

谢谢。

Answer 1

您可以尝试以下示例。 我已经使用这种格式的方式来做同样的事情。

document.getElementById("myForm").addEventListener("submit", function(event) {
event.preventDefault(); // Prevent the default form submission

// Create a new FormData object from the form
var formData = new FormData(this);

// Create a new XMLHttpRequest object
var xhr = new XMLHttpRequest();

// Specify the POST method and the URL to send the request to
xhr.open("POST", "assets/php/ajax/login.php", true);

// Set the onload function to handle the response
xhr.onload = function() {
    if (xhr.status === 200) {
        // Request was successful
        console.log(xhr.responseText);
    } else {
        // Request failed
        console.error('Request failed: ' + xhr.status);
    }
};

// Send the FormData object as the request body
xhr.send(formData);
});