将数据传递到 PHP 页面时，jQuery AJAX 不起作用

Question

我的 jQuery 的验证部分有效，但是，AJAX 部分似乎没有做任何事情，我想知道为什么？ 它没有错误，并且没有 AJAX 注册工作完美，但是，我必须使用它。

register.php 中的 HTML 表单：

<form method="post" action="register.php" name="registration-form" id="register-form">
    <div class="form-group" id="email-group">
        <label for="email"> Email address </label>
        <input id="email" type="email" name="email" class="form-control" aria-describedby="emailHelp" required>
    </div>
    <div class="form-group" id="password-group">
        <label for="password"> Password </label>
        <input id="password" type="password" name="password" class="form-control" required>
    </div>
    <div class="form-group form-check">
        <input type="checkbox" name="terms" class="form-check-input" required> I accept the <a class="privacy-link"
            href="privacy-policy.php"> Privacy Policy </a>
    </div>
    <button type="submit" name="register_user" class="btn btn-primary" value="register_user">Register</button>
</form>

带有 AJAX 的 jQuery：

$(document).ready(function () {
    $("#register-form").submit(function (event) {
        event.preventDefault();
    }).validate({
        rules: {
            email: {
                minlength: 6
            },
            password: {
                minlength: 8
            }
        },
        messages: {
            email: "Email should be at least 6 characters",
            password: "Password should be at least 8 characters"
        },
        submitHandler: function (form) {

            var email = $("#email").val();
            var password = $("#password").val();

            $.ajax({
                url: "register.php",
                contentType: "application/json",
                type: "POST",
                data: {
                    email: email,
                    password: password
                }
            }).done(function (response) {
                // some actions
            });
        }
    });
});

register.php PHP 来处理它：

if (isset($_POST['register_user'])) {
    /* Others */
}

我尝试了各种“isset”，但都无济于事。

Answer 1

我在这里看到了一些错误。

1. 也许您不应该捕获表单的“提交”事件，我相信验证插件会处理它。 根据文档：https://jqueryvalidation.org/validate/#submithandler 也许你应该删除这部分：

   .submit(函数(事件){ event.preventDefault(); })

2. 在您的 ajax 调用中，您提交了 2 个帖子变量 email 和 password 但是在您的 PHP 文件中，您尝试检索不存在的 $_POST['user_registration'] 变量，因为您没有将表单提交到服务器的 register.php 文件，您只提交了 2 个变量 email 和 password

我建议您使用FormData (https://developer.mozilla.org/en-US/docs/Web/API/FormData/FormData)，因此您只需更新以下代码即可使其正常工作（理论上）

例子

data = new FormData(document.getElementById('#register-form'));
$.ajax({
              url: "register.php",
              type: "POST",
              data: data,
              processData: false,
              contentType: false,
          })

你可以参考这个SO问题https://stackoverflow.com/a/8244082/5856233