Question

我有几个使用相同的通用AJAX代码的联系表单：

$(document).ready(function() {
    $('#mainMail').submit( function() {
        $.ajax({
            type: "POST",

            url : "<?php echo home_url(); ?>/wp-content/themes/retlehs-roots-f45f4f5/assets/bin/process.php",
            data: $(this).serialize(),
            success: function() {
                    $('#enquiryBox #submitSuccess').removeClass('hidden');
                    setTimeout(function() { $("#enquiryBox #submitSuccess").addClass('hidden'); }, 15000);       
                },
            error: function() {
                $('#enquiryBox #submitFail').removeClass('hidden');
                setTimeout(function() { $("#enquiryBox #submitFail").addClass('hidden'); }, 15000);
            }
            });
        return false;
    });
});

简而言之，当它成功提交表单并通过电子邮件发送给我（通过process.php）时，#submitSuccess div会显示它应该显示的内容。问题是，当它失败时，div 也会显示（#submitFail div保持隐藏状态。）

我猜这是因为只有在没有成功调用process.php的情况下才会发生ajax post失败？有没有办法调整这个，以便如果电子邮件没有通过process.php发送给我，用户会收到一条错误消息？

这是我的process.php代码：

<?php 

$robotest = $_POST['robotest']; //just testin' for robots

$recipient = "info@mydomain.com"; //recipient 
$email = ($_POST['email']); //senders e-mail adress 

if((filter_var($email, FILTER_VALIDATE_EMAIL)) && ($robotest == "")) { 

$Name = ($_POST['name']); //senders name 

$mail_body  = "Hello, \r\n \r\n";
$mail_body .= "You have received a new booking with the following details: \r\n\r\n";
$mail_body .= "{$_POST['comments']}; \r\n \r\n";
$mail_body .= "Please respond to the customer within 30 minutes on the following phone number: {$_POST['phone']} \r\n";
$mail_body .= "Warm regards, \r\n";
$mail_body .= "Robot. \r\n";



$subject = "Free Consult Inquiry"; //subject 
$header = "From: ". $Name . " <" . $email . ">\r\n"; //optional headerfields 

mail($recipient, $subject, $mail_body, $header); //mail command :) 

} else {
  print "You've entered an invalid email address!";
 }
?>

（print "you've entered an invalid email address!"是我尝试收到的错误信息，但这也不起作用......）

Answer 1

将此行$("#enquiryBox #submitSuccess").addClass('hidden');添加到错误块中，

  $.ajax({
        type: "POST",

        url : "<?php echo home_url(); ?>/wp-content/themes/retlehs-roots-f45f4f5/assets/bin/process.php",
        data: $(this).serialize(),
        success: function() {
                $('#enquiryBox #submitSuccess').removeClass('hidden');
                setTimeout(function() { $("#enquiryBox #submitSuccess").addClass('hidden'); }, 15000);       
            },
        error: function() {
            $('#enquiryBox #submitFail').removeClass('hidden'); //why do you remove class 'hidden' and add it later too ??
            $("#enquiryBox #submitSuccess").addClass('hidden'); //added line here
            setTimeout(function() { $("#enquiryBox #submitFail").addClass('hidden'); }, 15000);
        }
        });

Answer 2

您可以通过返回HTTP错误代码来指示错误，例如

} else {
  header("HTTP/1.1 500 Internal error");
  print "You've entered an invalid email address!";
 }

Answer 3

如果您阅读manual entry on jQuery.ajax()，您会发现发生协议或网络错误时会发生错误事件。如果您的脚本返回false，null或类似的内容，它仍被视为有效的响应，因此您的问题就会出现。

在这种情况下，我会编写它以便所有调用最终调用一个方法，如果调用了错误事件，它将使用重建的错误消息调用相同的方法。

AJAX联系表单未发布时的错误消息

3 个答案: