提交表单后阻止重定向

I have an HTML form that submits an email with PHP, and when it submits, it redirects to that PHP page. Is there a way to prevent this redirect from happening? I built an animation with jQuery that I want to occur instead of redirecting. I tried return false;, but it wouldn't work. Here's my function:

我有一个HTML表单，用PHP提交电子邮件，当它提交时，它会重定向到该PHP页面。有没有办法防止这种重定向发生？我用jQuery构建了一个动画，我想要发生而不是重定向。我试过返回false;但它不起作用。这是我的功能：

$(function() {
    $('.submit').click(function() {
        $('#registerform').submit();
        return false;
    }); 
});

Here's the opening form tag:

这是开场表格标签：

<form id="registerform" action="submit.php" method="post">

And the submit button:

并提交按钮：

<input type="submit" value="SUBMIT" class="submit" />

13 个解决方案

#1

You should post it with ajax, this will stop it from changing the page, and you will still get the information back.

你应该用ajax发布它，这将阻止它改变页面，你仍然会得到回来的信息。

$(function() {
    $('form').submit(function() {
        $.ajax({
            type: 'POST',
            url: 'submit.php',
            data: { username: $(this).name.value, 
                    password: $(this).password.value }
        });
        return false;
    }); 
})

See Post documentation for JQuery

请参阅JQuery的Post文档

#2

Instead of return false, you could try event.preventDefault(); like this:

您可以尝试event.preventDefault（）;而不是返回false。喜欢这个：

$(function() {
$('#registerform').submit(function(event) {
    event.preventDefault();
    $(this).submit();
    }); 
});

#3

If you want the information in the form to be processed by the PHP page, then you HAVE to make a call to that PHP page. To avoid a redirection or refresh in this process, submit the form info via AJAX. Perhaps use jQuery dialog to display the results, or your custom animation.

如果您希望PHP页面处理表单中的信息，那么您必须调用该PHP页面。要避免在此过程中重定向或刷新，请通过AJAX提交表单信息。也许使用jQuery对话框来显示结果或自定义动画。

#4

Using Ajax

Using the jQuery Ajax request method you can post the email data to a script (submit.php). Using the success callback option to animate elements after the script is executed.

使用jQuery Ajax请求方法，您可以将电子邮件数据发布到脚本（submit.php）。在执行脚本后使用成功回调选项为元素设置动画。

note - I would suggest utilizing the ajax Response Object to make sure the script executed successfully.

注意 - 我建议使用ajax响应对象来确保脚本成功执行。

$(function() {
    $('.submit').click(function() {
        $.ajax({
            type: 'POST',
            url: 'submit.php',
            data: 'password=p4ssw0rt',
            error: function()
            {
               alert("Request Failed");
            },
            success: function(response)
            {  
               //EXECUTE ANIMATION HERE
            });
        return false;
    }); 
})

#5

With out knowing exactly what your trying to accomplish here its hard to say but if your spending the time to solve this problem with javascript an AJAX request is going to be your best bet. However if you'd like to do it completely in PHP put this at the end of your script, and you should be set.

不知道你想要在这里完成什么很难说，但如果你花时间用javascript来解决这个问题，那么AJAX请求将是你最好的选择。但是，如果您想在PHP中完全使用它，请将其放在脚本的末尾，并且应该进行设置。

if(isset($_SERVER['HTTP_REFERER'])){
    header("Location: " . $_SERVER['HTTP_REFERER']);    
} else {
    echo "An Error";
}

This will still cause the page to change, twice, but the user will end on the page initiating the request. This is not even close to the right way to do this, and I highly recommend using an AJAX request, but it will get the job done.

这仍然会导致页面更改两次，但用户将在发起请求的页面上结束。这甚至没有接近正确的方法，我强烈建议使用AJAX请求，但它将完成工作。

#6

$('#registerform').submit(function(e) {
   e.preventDefault();
   $.ajax({
        type: 'POST',
        url: 'submit.php',
        data: $(this).serialize(),
        beforeSend: //do something
        complete: //do something
        success: //do something for example if the request response is success play your animation...
   });

})

#7

If you can run javascript, which seems like you can, create a new iframe, and post to that iframe instead. You can do <form target="iframe-id" ...> That way all the redirects happen in the iframe and you still have control of the page.

如果你可以运行javascript，你可以创建一个新的iframe，然后发布到那个iframe。您可以执行

这样，所有重定向都会发生在iframe中，您仍然可以控制页面。

The other solution is to also do a post via ajax. But that's a little more tricky if the page needs to error check or something.

另一个解决方案是通过ajax发布帖子。但如果页面需要进行错误检查或其他事情，这会更棘手。

Here is an example:

这是一个例子：

$("<iframe id='test' />").appendTo(document.body);
$("form").attr("target", "test");

#8

Probably you will have to do just an Ajax request to your page. And doing return false there is doing not what you think it is doing.

可能您只需要对页面执行Ajax请求。并且返回假是没有你认为它正在做的事情。

#9

The design of HTTP means that making a POST with data will return a page. The original designers probably intended for that to be a "result" page of your POST.

HTTP的设计意味着使用数据进行POST将返回页面。原始设计师可能打算将其作为POST的“结果”页面。

It is normal for a PHP application to POST back to the same page as it can not only process the POST request, but it can generate an updated page based on the original GET but with the new information from the POST. However, there's nothing stopping your server code from providing completely different output. Alternatively, you could POST to an entirely different page.

PHP应用程序POST回到同一页面是正常的，因为它不仅可以处理POST请求，而且可以根据原始GET生成更新的页面，但使用POST中的新信息。但是，没有什么能阻止您的服务器代码提供完全不同的输出。或者，您可以POST到完全不同的页面。

If you don't want the output, one method that I've seen before AJAX took off was for the server to return a HTTP response code of (I think) 250. This is called "No Content" and this should make the browser ignore the data.

如果您不想要输出，我在AJAX开始之前看到的一种方法是服务器返回（我认为）250的HTTP响应代码。这称为“无内容”，这应该是浏览器忽略数据。

Of course, the third method is to make an AJAX call with your submitted data, instead.

当然，第三种方法是使用您提交的数据进行AJAX调用。

#10

The simple answer is to shoot your call off to an external scrip via AJAX request. Then handle the response how you like.

简单的答案是通过AJAX请求将您的呼叫发送到外部脚本。然后按照你喜欢的方式处理响应。

#11

Just like Bruce Armstrong suggested in his answer. However I'd use FormData:

就像布鲁斯阿姆斯特朗在他的回答中所说的那样。但是我使用FormData：

$(function() {
    $('form').submit(function() {
        var formData = new FormData($(this)[0]);
        $.ajax({
            type: 'POST',
            url: 'submit.php',
            data: formData,
            processData: false,
            contentType: false,
        });
        return false;
    }); 
})

#12

You must put the return inside submit() call.

你必须把return放在submit（）调用中。

  $('.submit').click(function() {
     $('#registerform').submit(function () {
     sendContactForm();
     return false;
    });
    //Here you can do anything after submit
}

#13

You can use as below

你可以使用如下

e.preventDefault() 

If this method is called, the default action of the event will not be triggered.

如果调用此方法，则不会触发事件的默认操作。

Also if I may suggest read this: .prop() vs .attr()

另外，如果我建议读这个：.prop（）vs .attr（）

I hope it will help you,

我希望它能帮助你，

code example:

代码示例：

$('a').click(function(event){
    event.preventDefault();
    //do what you want
  }