Question

我有一个基本上连接到某个位置的登录页面，并进行简单的后期调用。如果用户点击提交并且帖子返回200或成功，我想将页面重定向到其他地方。如果没有，返回失败。最简单的方法是什么？我正在研究客户端重定向。

<html>
<head>
<title>Login</title>
</head>

<body>
<form action="/1.1.1.1:80/login" method="POST">

    <p>Username: <input type="text" name="username" /><p>
     <p>Password: <input type="password" name="password" /><p>
<p><input type="submit" value="Log In" /></p>
    {% module xsrf_form_html() %}

</form>
</body>
</html>

更新：

<html>
<head>
<title>Please Log In</title>
<script src="/Users/src/downloads/app/jquery-2.1.4.min.js" type="text/javascript"></script>
</head>

<body>
<form action="https://1.1.1.1:80/login" method="POST">
#Tried as well, but doesn't redirect <form action="https://google.com" method="POST"> 

    <input class="form-control" type="text" required name="username" placeholder="username">
        <input class="form-control" type="password" required name="password" placeholder="Password">
            <input class="form-control" type="hidden" required name="eauth" value="pam">

<p><input type="submit" value="Log In" /></p>
    {% module xsrf_form_html() %}

</form>
</body>
</html>

<script type="text/javascript">
    $('form').submit(function(){
                     $.ajax({
                            type: "Post",
                            url: $('form').attr('action'),
                            success: function (response) {
                            window.location = 'http://www.google.com';
                            //error handling
                            }
                            });

                     //return false so the form does not submit again
                     return false;
                     });
    </script>

Answer 1

你可以通过jquery（ajax）发布你的表格，当结果回来决定你想做什么这个link可以帮到你

// Variable to hold request
var request;

// Bind to the submit event of our form
$("#foo").submit(function(event){

// Abort any pending request
if (request) {
    request.abort();
}
// setup some local variables
var $form = $(this);

// Let's select and cache all the fields
var $inputs = $form.find("input, select, button, textarea");

// Serialize the data in the form
var serializedData = $form.serialize();

// Let's disable the inputs for the duration of the Ajax request.
// Note: we disable elements AFTER the form data has been serialized.
// Disabled form elements will not be serialized.
$inputs.prop("disabled", true);

// Fire off the request to /form.php
request = $.ajax({
    url: "/form.php",
    type: "post",
    data: serializedData
});

// Callback handler that will be called on success
request.done(function (response, textStatus, jqXHR){
    // Log a message to the console
    console.log("Hooray, it worked!");
});

// Callback handler that will be called on failure
request.fail(function (jqXHR, textStatus, errorThrown){
    // Log the error to the console
    console.error(
        "The following error occurred: "+
        textStatus, errorThrown
    );
});

// Callback handler that will be called regardless
// if the request failed or succeeded
request.always(function () {
    // Reenable the inputs
    $inputs.prop("disabled", false);
});

// Prevent default posting of form
event.preventDefault();
});

Answer 2

包含jQuery并尝试根据您的代码输入使用它

<script type="text/javascript">
    $(document).ready(function(){
      $('form').submit(function(){
        $.ajax({
            url: 'your-php-file.php',
            dataType: 'html',
            success: function(response) {
                window.location.href = response;
            }
        });
    });
     });
</script>

Answer 3

尝试这样的事情：

确保您拥有downloaded jquery.js file，将其放在您的目录中，并将其放在头标记中

<script src="path to your jquery file" type="text/javascript"></script>

将它放在html的末尾：

<script type="text/javascript">
$('form').submit(function(){
    $.ajax({
        type: "Post",
        url: $('form').attr('action'),
        success: function (result) {
            if(result.Code == 200) //change this to your status code return
              window.location = 'http://www.google.com';
            else
               //error handling
        }
    });

   //return false so the form does not submit again
   return false;
 });
 </script>

这应该捕获表单的提交事件，而不是通过ajax发布它，这将允许您根据需要处理响应。

使用html和ajax或js从客户端重定向

3 个答案: