javascript - 联系表单响应非常慢(PHP/jQuery/Ajax)

Question

我正在设置一个非常基本的 PHP/jQuery/Ajax 联系表单；当它工作时，响应非常慢(显示成功消息需要 5 秒以上)，我想知道我可能做错了什么。

这是所有相关代码:

标记:

<form id="contact-form" name="contact-form" action="php/form-process.php" method="post" role="form">
    <input type="text" name="name" id="name" placeholder="Name" required>
    <input type="email" name="email" id="email" placeholder="Email" required>
    <textarea id="message" name="message" rows="5" placeholder="Your message" required></textarea>
    <button type="submit" id="form-submit" class="contact-button">Submit</button>
    <div id="msg-submit" class="hidden">Message sumbitted!</div>
</form>

PHP:

<?php
$name = $_POST["name"];
$email = $_POST["email"];
$message = $_POST["message"];

$EmailTo = "test@test.com";
$Subject = "New Contact Form Message";

// prepare email body text
$Body .= "Name: ";
$Body .= $name;
$Body .= "\n";

$Body .= "Email: ";
$Body .= $email;
$Body .= "\n";

$Body .= "Message: ";
$Body .= $message;
$Body .= "\n";

// send email
$success = mail($EmailTo, $Subject, $Body, "From:".$email);

// redirect to success page
if ($success){
   echo "success";
}else{
    echo "invalid";
}

?>

jQuery:

$('#contact-form').submit(function(event){
        event.preventDefault();
        submitForm(); 
    });

    function submitForm(){
        var $this = $('#contact-form');
        $.ajax({
            type: $this.attr('method'),
            url: $this.attr('action'),
            data: $this.serialize(),
            success : function(text){
                if (text == "success"){
                    formSuccess();
                }
            }
        });
    }
    function formSuccess(){
        $("#msg-submit").removeClass("hidden");
    }

我省略了所有表单验证功能，以坚持绝对的基础知识。我不确定是否是服务器导致响应缓慢，但理想情况下，我希望用户单击“提交”后立即显示成功消息。感谢您在此提供的任何帮助。

Answer 1

我假设您假设的是 PHPMailer，但如果我错了，请纠正我。如果没有，请考虑使用它来实现下一部分。

您的 PHP 脚本正在等待电子邮件发送。不应该这样做。您需要使用邮件服务器发送它。看这个superb answer关于如何使用 PHPMailer 做到这一点。