如何在不刷新页面的情况下发送表单？答案

【问题标题】：How to send a form without refreshing the page?如何在不刷新页面的情况下发送表单？
【发布时间】：2012-01-11 12:14:49
【问题描述】：

我不懂 PHP。

我不希望用户在发送表单后转到http://www.example.com/feedback-thanks.html。我想要的是发送按钮下方的文本或任何无需刷新页面。

我删除了header( "Location: http://www.example.com/feedback-thanks.html" );，但我没有收到电子邮件并且用户被重定向到feedback.php... :(

html

<form method="post" action="feedback.php">
<input name="email" type="email"/>
<textarea name="message" id="feedback-textarea" autofocus="autofocus" required="required" ></textarea>
<button type="submit" id="feedback-button-send">send</button>
</form>

feedback.php

<?php
  $email = $_REQUEST['email'] ;
  $message = $_REQUEST['message'] ;

  mail( "abcde@gmail.com", "Subject Here",
    $message, "From: $email" );
  header( "Location: http://www.example.com/feedback-thanks.html" );
?>

【问题讨论】：

标签： php html html-email

【解决方案1】：

您必须为此使用$.ajax()

这是我在我的一个应用程序中使用的

$('#submitSearch').click(function() {

        var formData = {
            searchData: $('#searchData').val(),
        };

        $.ajax({
            url: siteUrl + 'fetch/search',
            type: "POST",
            data: formData,
            cache: true,            
            beforeSend:function(){
                jQuery('#main').html('<div class="loading"><img src="' + siteUrl + 'resources/imgs/ajax-loader.gif" alt="Loading..." /></div>');
            },
            success: function(data) {
                jQuery('#main').empty();
                jQuery('#main').append(data);
            },
            error:function(x,e){
                if(x.status==0){
                    alert('You are offline!!\n Please Check Your Network.');
                }else if(x.status==404){
                    alert('Requested URL not found.');
                }else if(x.status==500){
                    alert('Internel Server Error.');
                }else if(e=='parsererror'){
                    alert('Error.\nParsing JSON Request failed.');
                }else if(e=='timeout'){
                    alert('Request Time out.');
                }else {
                    alert('Unknow Error.\n'+x.responseText);
                }
            }
        });
        return false;
    });

【讨论】：

非常感谢！这对我有帮助，现在我正在学习更多关于 AJAX 的知识。

【解决方案2】：

我建议使用像 jQuery 这样的 Javascript 框架并使用它的 AJAX 函数。如果你用谷歌搜索，可以在互联网上找到很多教程。

从jquery.com开始

【讨论】：

【解决方案3】：

可能性 - 以任何形式使用 ajax - jQuery、plain 等...参见 Google
可能性 - 创建带有 name="sender" 的隐藏 iframe 并使用表单目标属性（我不确定它是否有效，但它可以在没有 javascript 的情况下工作）

【讨论】：

【解决方案4】：

如果您想要我想要的内容，请查看本教程（附演示）

http://net.tutsplus.com/tutorials/javascript-ajax/submit-a-form-without-page-refresh-using-jquery/

【讨论】：