联系表单Javascript/Ajax/PHP不是'；t工作

我正在尝试创建一个联系人表单，我花了一整天的时间试图弄清楚为什么它不起作用。我有

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>

在我页面的顶部。

这是形式：

<div id="CTwrapper">
  <form action="" method="">
    <legend>Send me a message</legend>
    <input type="text" placeholder=" &#xf007;  Name" id="Contactname" onfocus="this.placeholder = ''" onblur="this.placeholder = ' &#xf007;  Name'" name="name">
    <label class="error" for="name" id="name_error">This field is required.</label>
    <input type="email" id="email" placeholder=" &#xf0e0;  Email" onfocus="this.placeholder = ''" onblur="this.placeholder = ' &#xf0e0;  Email'" name="email">
    <label class="error" for="email" id="email_error">This field is required.</label>
    <textarea id="message" rows="6" cols="50" placeholder=" &#xf040;  Message" onfocus="this.placeholder = ''" onblur="this.placeholder = ' &#xf040;  Message'" name="message"></textarea>
    <label class="error" for="message" id="message_error">This field is required.</label><br />
    <button class="send" type="submit" value="Send">Send</button><button type="reset" value="Clear">Clear</button>
  </form>
</div>

这就是Javascript/Ajax:

$(function() {
  $('.error').hide();
  $(".send").click(function() {
    $('.error').hide()
    var name = $("input#Contactname").val();
    if (name == "") {
      $("label#name_error").show();
      $("input#name").focus();
      return false;
    }
    var email = $("input#email").val();
    if (email == "") {
      $("label#email_error").show();
      $("input#email").focus();
      return false;
    }
    var message = $("input#message").val();
    if (message == "") {
      $("label#message_error").show();
      $("input#message").focus();
      return false;
    }
    var dataString = 'name='+ Contactname + '&email=' + email + '&message=' + message;
    $.ajax({
      type: "POST",
      url: "mail.php",
      data: dataString,
      success: function() {
        $('#CTwrapper').html("<div id='message'></div>");
        $('#message').html("<h2><style="color:#FFF;">Contact Form Submitted!</style></h2>")
                           .append("<p>We will be in touch soon.</p>")
        .hide()
        .fadeIn(1500, function() {
          $('#message').append("<img id='checkmark' src='images/check.png' />");
        });
      }
    });
    return false;                                     
  });
});

这就是PHP:

<?php 
$name = $_POST['Contactname']; 
$email = $_POST['email']; 
$message = $_POST['message']; 
$formcontent="From: $name 'n Message: $message"; 
$recipient = "amyclark1@outlook.com"; 
$subject = "Contact form - www.amymorrisclark.com"; 
$mailheader = "From: $email 'r'n"; 
mail($recipient, $subject, $formcontent, $mailheader) or die("Uh oh!");     
?>

它在一个名为mail.php的单独文件中

我真正想要的是，表单在提交时消失，并且能够在其位置显示一条消息，说明for已提交，而无需刷新页面，并且实际收到了邮件。我似乎无法把这一切都配合起来。真的很感谢你的帮助。谢谢

此外，如果有更好/更快/更容易的方法，请告诉我。