Question

之前我已经在Stack Overflow上看过这个问题了，但是我的网站还没有能够让以前的解决方案有效！

我有一个＆＃39;联系人＆＃39;网站上的页面（staging.twotailsmedia.com)。现在，“联系”页面可以工作并向正确的位置发送电子邮件，但它会在新的单独的位置生成一条“谢谢！”消息，未格式化的页面。不是我想要的。我希望它留在联系页面上，在提交按钮旁边的表单上生成“谢谢！”确认。

这是来自index.html文件的表单的 HTML ：

<form method="POST" action="mail.php">

   <div class="field half first">
      <label for="name">Name</label>
      <input type="text" name="name" id="name" />
   </div>

<div class="field half">
   <label for="email">Email</label>
   <input type="text" name="email" id="email" />
</div>

<div class="field">
   <label for="message">Message</label>
   <textarea name="message" id="message" rows="4"></textarea>
</div>

<ul class="actions">
   <li><input type="submit" value="Send Message" class="special" /></li>
   <li><input type="reset" value="Reset" /></li>
</ul>

</form>

这是来自mail.php文件的 PHP ：

<?php

        $name = $_POST['name'];

        $email = $_POST['email'];

        $message = $_POST['message'];

        $formcontent="From: $name \n Message: $message";

        $recipient = "info@emailaddress.com";

        $subject = "A message from the Two Tails MEdia website!";

        $mailheader = "From: $email \r\n";

        mail($recipient, $subject, $formcontent, $mailheader) or die("Error!");

        echo "Thank You! We'll get back to you.";
}
?>

通常我只是从Wordpress获得一个联系表单插件，但我试图做一个非WP页面，这样我就可以更深入地了解Web开发过程。

Answer 1

使用Ajax提交表单，并通过成功显示您的消息。试试这段代码：

$('form').submit(function(e){
   e.preventDefault();
   $.ajax({
     type:'post',
     url:'mail.php',
     data:$(this).serialize(),
     success:function(){
         $('form')[0].reset(); // to reset the form
         $('#contact').hide(); // to hide the Contact article
         $('#message').show(); // to show the hidden message
     }
   })
})

提交＆＃39;联系人＆＃39;消息，我如何让它留在页面上并生成文本确认？

1 个答案: