通过Ajax的get请求将表单数据传送到数据库

要通过Ajax的GET请求将表单数据发送到数据库，你需要一个后端脚本来处理数据并将其存储到数据库中。以下是一个简单的例子：

前端HTML和JavaScript代码：




<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ajax Form Submission</title>
    <script>
        function submitForm() {
            var name = document.getElementById('name').value;
            var email = document.getElementById('email').value;
            var xhr = new XMLHttpRequest();
            xhr.open('GET', 'submit.php?name=' + encodeURIComponent(name) + '&email=' + encodeURIComponent(email), true);
            xhr.onload = function() {
                if (this.status == 200) {
                    alert(this.responseText);
                }
            };
            xhr.send();
        }
    </script>
</head>
<body>
    <form id="myForm">
        Name: <input type="text" id="name" name="name"><br>
        Email: <input type="email" id="email" name="email"><br>
        <input type="button" value="Submit" onclick="submitForm();">
    </form>
</body>
</html>

后端PHP代码 (submit.php)：




<?php
$servername = "localhost";
$username = "your_username";
$password = "your_password";
$dbname = "your_dbname";
 
// 接收GET请求的参数
$name = $_GET['name'];
$email = $_GET['email'];
 
// 创建连接
$conn = new mysqli($servername, $username, $password, $dbname);
 
// 检查连接
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}
 
// 插入数据到数据库
$sql = "INSERT INTO users (name, email) VALUES (?, ?)";
$stmt = $conn->prepare($sql);
$stmt->bind_param("ss", $name, $email);
$stmt->execute();
 
echo "New record created successfully";
 
$stmt->close();
$conn->close();
?>

确保你的数据库中有一个名为 users 的表，并且有 name 和 email 字段。

注意：使用GET请求发送敏感数据（如密码）不安全，因为这些数据将显示在URL中。使用POST请求和更安全的方法（如SSL）是更好的选择。

通过Ajax的get请求将表单数据传送到数据库

评论已关闭

推荐阅读