Question

由于某种原因，我没有收到AJAX调用的回复。我已经使用Chrome和Firefox中的控制台来监视此操作，但是我只能看到表单发送的内容。我正在使用MAMP，还没有在实时服务器上尝试过此操作，但是我需要它在MAMP中工作。我已经尝试了很多人从我在stackoverflow中发现的类似问题中提出的建议，但是已知有效，请帮忙！

<form id="signup_submit" method="post" action="AJAX/signup.php">
                    <div class="form-group show-progress">

                    </div>
        <div class="form-group">
                    <input type="text" name="firstname" id="firstname" class="form-control" autocomplete="firstname" placeholder="Enter First Name...">
                    <span class="firstname-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                    <input type="text" name="surname" autocomplete="surname" id="surname" class="form-control" placeholder="Enter Surname...">
                    <span class="surname-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <input type="email" name="email" id="email" autocomplete="email"  class="form-control" placeholder="Enter Email...">
                        <span class="email-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <input type="password" name="password" autocomplete="password"  id="password" class="form-control" placeholder="Choose Password...">
                        <span class="password-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <input type="password" id="confirm" name="confirm" autocomplete="confirm"  class="form-control" placeholder="Confirm Password...">
                        <span class="confirm-error error"></span>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <button type="submit" id="submit" >Create Account</button>
                    </div><!-- form-group -->
                    <div class="form-group">
                        <a href="#" id="login">Already have an account?</a>
                    </div>
                </form><!-- form -->

signup.js

    $(document).ready(function(){
    $('form').submit(function(e){
        e.preventDefault();
        var data = $('#signup_submit').serialize();
        console.log(data)
        $.ajax({
            type:'POST',
            URL: 'AJAX/signup.php',
            data: data,
            dataType: 'json',
            encode:true,
            success: function(d){
                d = JSON.parse(d);
                console.log(d.testjson);
                if(d.success){
                    $('#signup_submit').append('<div>'+d.message+'</div>');
                }else{
                    if(d.errors.firstname){$('.firstname-error').show();$('.firstname-error').html(d.errors.firstname);}
                    if(d.errors.surname){$('.surname-error').show();$('.surname-error').html(d.errors.surname);}
                    if(d.errors.email){$('.email-error').show();$('.email-error').html(d.errors.emailname);}
                    if(d.errors.password){$('.password-error').show();$('.password-error').html(d.errors.password);}
                    if(d.errors.confirm){$('.confirm-error').show();$('.confirm-error').html(d.errors.confirm);}
                }
            }
        })
    })

})

signup.php

<?php 
$errors = array();
$response = array();

if(empty($_POST['firstname'])){$errors['firstname'] = 'First Name Is Required!';}
if(empty($_POST['surname'])){$errors['surname'] = 'Surname Is Required!';}
if(empty($_POST['email'])){$errors['email'] = 'Email Address Is Required!';}
if(empty($_POST['password'])){$errors['password'] = 'Password Is Required!';}
if(empty($_POST['confirm'])){$errors['confirm'] = 'Please Confirm Your Password!';}

$response['errors'] = $errors;

if (!empty($errors)){

    $response['success'] = false;
    $response['message'] = 'FAIL!';
}else{
    $response['success'] = true;
    $response['message'] = 'SUCCESS!';  

}



 ?>

Answer 1

您永远不会在signup.php文件中返回任何内容。您需要json_encode并在脚本末尾使用echo或exit。

<?php

$errors = array();
$response = array();

if (empty($_POST['firstname'])) $errors['firstname'] = 'First Name Is Required!';
if (empty($_POST['surname'])) $errors['surname'] = 'Surname Is Required!';
if (empty($_POST['email'])) $errors['email'] = 'Email Address Is Required!';
if (empty($_POST['password'])) $errors['password'] = 'Password Is Required!';
if (empty($_POST['confirm'])) $errors['confirm'] = 'Please Confirm Your Password!';

$response['errors'] = $errors;

if (!empty($errors)) {
    $response['success'] = false;
    $response['message'] = 'FAIL!';
} else {
    $response['success'] = true;
    $response['message'] = 'SUCCESS!';
}

// Return data here
exit(json_encode($response));

?>

编辑：将PHP exit保留在上方，但使用jQuery.post()而不是jQuery.ajax()，因为它比弄乱内容更短，更干净，更简单类型。它还可以解决您的问题：

$(document).ready(function(){
    $('form').submit(function(e) {
        e.preventDefault();
        var data = $('#signup_submit').serialize();

        console.log("data:");
        console.log(data);

        $.post("AJAX/signup.php", data, result => {
            console.log("result:");
            console.log(result);

            result = JSON.parse(result);

            if (result.success) {
                $('#signup_submit').append('<div>'+result.message+'</div>');
            } else {
                if (result.errors.firstname) $('.firstname-error').html(result.errors.firstname).show();
                if (result.errors.surname) $('.surname-error').html(result.errors.surname).show();
                if (result.errors.email) $('.email-error').html(result.errors.email).show();
                if (result.errors.password) $('.password-error').html(result.errors.password).show();
                if (result.errors.confirm) $('.confirm-error').html(result.errors.confirm).show();
            }
        });
    });
});

Answer 2

删除dataType：“ json”，然后尝试。在回显结果之前，还要设置标题，如下所示：

header('Content-type:application/json');
echo json_encode($response);

无法使用Mamp

2 个答案: