Question

我在我的网站上创建了一个PHP联系表单，除了查看它将用户发送到thank-you.php页面的成功或错误消息之外，该表单运行良好。这就是我设置它的方式，但我希望用户提交，表格应该消失并说谢谢！代替表格。

以下是表单的HTML：

<form class="form-foot" action="thank-you.php" method="post">
<fieldset>
<legend>Footer contact form</legend>
<div class="field">
<label for="name">Your name: </label>
<input name="name" id="name" type="text" placeholder="Name" class="required field-name" required>
</div>
<div class="field">
<label for="email">Your email: </label>
<input name="email" id="email" type="email" placeholder="Email address" class="required  field-email" required>
</div>
<div class="field">
<label for="message">Message: </label>
<textarea name="message" id="message" cols="30" rows="8" class="required field-message" placeholder="Your message" required></textarea>
</div>
<div class="field-submit">
<input class="sendbutton" type="submit"/>
</div>
</fieldset>
</form>

这是我在谢谢你.php页面中的PHP：

<?php $name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];
$formcontent="From: $name \n Message: $message";
$recipient = "myemail@mysite.com";
$subject = "Contact Form";
$mailheader = "From: $email \r\n";
mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
echo "Thank You!";
?>

如何在提交时使表单消失并回复Thank You成功消息，而无需使用thank-you.php或刷新页面。

由于

Answer 1

替换：

<form class="form-foot" action="thank-you.php" method="post">

使用：

<form name="myform" class="form-foot" action="" method="post">

为您的提交按钮命名：

<input name="submit" class="sendbutton" type="submit"/>

将代码从thank-you.php移动到yourform.php：

if(isset($_POST['submit']))
{

    $name = $_POST['name'];
    $email = $_POST['email'];
    $message = $_POST['message'];
    $formcontent="From: $name \n Message: $message";
    $recipient = "myemail@mysite.com";
    $subject = "Contact Form";
    $mailheader = "From: $email \r\n";
    mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");
    echo "Thank You!";
}

Answer 2

你可以使用ajax从javascript将数据发布到thank-you.php文件。通过调用提交中的函数而不是表单中的action属性。该函数可以具有以下格式

var url = "thank-you.php";
var data = $('#your-form-id').serialize();


$.ajax({
        type: "post",
        url: url,
        data: data,
        success: function(msg) {

        }    
   });

在从感谢页面收到消息后，您可以利用它为其分配包含表单的html以替换表单，谢谢！

PHP联系表单，显示同一页面上的成功和错误消息

2 个答案: