在ajax调用后执行javascript重定向

在使用 AJAX 调用后执行 JavaScript 重定向是一个常见的需求。您可以在 AJAX 请求成功后，根据返回的结果进行重定向。以下是一个简单的示例，展示了如何在 AJAX 调用后执行重定向。

示例：使用 jQuery 的 AJAX 调用

假设您使用 jQuery 进行 AJAX 调用，您可以在成功的回调函数中使用 window.location.href 来进行重定向。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AJAX Redirect Example</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>

<button id="submitButton">Submit</button>

<script>
    $(document).ready(function() {
        $('#submitButton').click(function() {
            $.ajax({
                url: 'your-api-endpoint', // 替换为您的 API 端点
                type: 'POST',
                data: {
                    // 发送的数据
                },
                success: function(response) {
                    // 根据响应进行重定向
                    if (response.success) {
                        // 重定向到新页面
                        window.location.href = 'new-page.html'; // 替换为您要重定向的 URL
                    } else {
                        // 处理错误情况
                        alert('Error: ' + response.message);
                    }
                },
                error: function(xhr, status, error) {
                    // 处理 AJAX 错误
                    alert('AJAX Error: ' + error);
                }
            });
        });
    });
</script>

</body>
</html>

示例：使用原生 JavaScript 的 Fetch API

如果您不使用 jQuery，而是使用原生 JavaScript 的 Fetch API，您可以这样做：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>AJAX Redirect Example</title>
</head>
<body>

<button id="submitButton">Submit</button>

<script>
    document.getElementById('submitButton').addEventListener('click', function() {
        fetch('your-api-endpoint', { // 替换为您的 API 端点
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                // 发送的数据
            })
        })
        .then(response => response.json())
        .then(data => {
            // 根据响应进行重定向
            if (data.success) {
                // 重定向到新页面
                window.location.href = 'new-page.html'; // 替换为您要重定向的 URL
            } else {
                // 处理错误情况
                alert('Error: ' + data.message);
            }
        })
        .catch(error => {
            // 处理 AJAX 错误
            alert('Fetch Error: ' + error);
        });
    });
</script>

</body>
</html>