使用成功的 Ajax 请求重定向页面

IT技术 javascript jquery ajax redirect
2021-01-26 02:05:15

我有一个使用 Ajax 进行客户端验证的表单。表格结尾如下:

$.ajax({
        url: 'mail3.php',
        type: 'POST',
        data: 'contactName=' + name + '&contactEmail=' + email + '&spam=' + spam,

        success: function(result) {
            //console.log(result);
            $('#results,#errors').remove();
            $('#contactWrapper').append('<p id="results">' + result + '</p>');
            $('#loading').fadeOut(500, function() {
                $(this).remove();

            });

        }
    });

编辑:这是我处理错误的 mail3.php 文件:

$errors=null; 

if ( ($name == "Name") ) {
    $errors = $nameError; // no name entered
}
if ( ($email == "E-mail address") ) {
    $errors .= $emailError; // no email address entered
}
if ( !(preg_match($match,$email)) ) {
    $errors .= $invalidEmailError; // checks validity of email
}
if ( $spam != "10" ) {
    $errors .= $spamError; // spam error
}

if ( !($errors) ) {
    mail ($to, $subject, $message, $headers);
    //header ("Location: thankyou.html");
    echo "Your message was successfully sent!";
    //instead of echoing this message, I want a page redirect to thankyou.html

} else {
    echo "<p id='errors'>";
    echo $errors;
    echo "</p>";
}

我想知道如果 ajax 请求成功并且不存在错误,是否可以将用户重定向到谢谢页面。这可能吗?

谢谢!阿米特

6个回答

当然。只需在成功函数的末尾放一些东西,例如:

if(result === "no_errors") location.href = "http://www.example.com/ThankYou.html"

no_errors当不存在错误时,您的服务器将返回响应

是否可以获取从 mail3.php 文件返回的 $error 变量(请参阅编辑)并检查其内容。如果 !($error),然后重定向页面?
2021-03-15 02:05:15
@Adam - 不一定。jQuery 的 Ajax 对象中的错误函数仍然可以访问响应的响应文本。
2021-03-30 02:05:15
@Jeremy- 是的,除非您想为站点传回特定的错误消息以处理或什至在失败时重定向到不同的 URL。这些消息必须与 200 响应代码一起返回,需要 no_errors 响应来区分。
2021-04-04 02:05:15
实际上,乍一看,我觉得这种方法行得通!
2021-04-05 02:05:15
正确使用 HTTP 状态代码将使每一次成功都成功,而无需服务器回传任何消息。
2021-04-10 02:05:15

只需进行一些错误检查,如果一切顺利,则设置window.location为将用户重定向到不同的页面。

$.ajax({
    url: 'mail3.php',
    type: 'POST',
    data: 'contactName=' + name + '&contactEmail=' + email + '&spam=' + spam,

    success: function(result) {
        //console.log(result);
        $('#results,#errors').remove();
        $('#contactWrapper').append('<p id="results">' + result + '</p>');
        $('#loading').fadeOut(500, function() {
            $(this).remove();

        });

        if ( /*no errors*/ ) {
            window.location='thank-you.html'
        }

    }
});
如果所有错误都通过 mail3.php 文件处理,我如何检查无错误情况?
2021-03-24 02:05:15
是否可以获取从 mail3.php 文件返回的 $error 变量(请参阅编辑)并检查其内容。如果 !($error),则重定向页面
2021-03-26 02:05:15
能不能说的详细一点?我究竟如何返回 500 的状态代码?
2021-03-28 02:05:15
@Amit 我会做类似 if(result === "Your message is successfully sent!")//redirect else $('#id ofEmptyDivOnPage').html(response) 之类的事情,如果有,它会在页面上显示错误如果不假设您有一个具有该 ID 的 div,则为错误和重定向
2021-03-31 02:05:15
您应该在 mail3.php 文件中捕获错误,并在响应中返回状态代码 500。
2021-04-04 02:05:15

您可以在success处理程序中重定向,如下所示:

window.location.href = "thankyou.php";

或者由于您正在显示结果,请等待几秒钟,例如这将等待 2 秒钟:

setTimeout(function() {
  window.location.href = "thankyou.php";
}, 2000);
@Amit - 你可以把它放在if(result === "Your message was successfully sent!")这之前,那只会在那些情况下发送。
2021-04-01 02:05:15
你能看看我的编辑,看看我如何处理没有错误的情况吗?如果没有错误,我只希望它被重定向到thankyou.php。
2021-04-03 02:05:15
$.ajax({
        url: 'mail3.php',
        type: 'POST',
        data: 'contactName=' + name + '&contactEmail=' + email + '&spam=' + spam,

        success: function(result) {

            //console.log(result);
            $('#results,#errors').remove();
            $('#contactWrapper').append('<p id="results">' + result + '</p>');
            $('#loading').fadeOut(500, function() {
                $(this).remove();

            });

            if(result === "no_errors") location.href = "http://www.example.com/ThankYou.html"

        }
    });

在您的 mail3.php 文件中,您应该在 try {} catch {} 中捕获错误

try {
    /*code here for email*/
} catch (Exception $e) {
    header('HTTP/1.1 500 Internal Server Error');
}

然后在你的success通话中你不必担心你的错误,因为它永远不会成功返回。

你可以使用:window.location.href = "thankyou.php";在你的成功函数中,就像尼克说的那样。