Jquery空结果

Question

问题

我提交的表单没有重定向到电子邮件php我试过了。为此，我使用了ajax并以某种方式工作，但它会返回空结果。我有javascript的问题，但这对我的初学者水平来说很难找到。我测试发送没有ajax的电子邮件，它发送正常。但是重定向到空白页面email.php

HTML

<form method="POST" id="myForm" data-toggle="validator" action="email.php">
  <h2 class="section-heading">Свяжитесь с нами:</h2>
  <div class="form-group">
    <label for="exampleInputEmail1">Имя:</label>
    <input style="background:none;" id="firstName" name="firtname" class="form-control" placeholder="Имя" required>
    <p id="p1"></p>
  </div>
  <div class="form-group">
    <label for="exampleInputEmail1">Тема:</label>
    <input style="background:none;" id="subjectTheme" name="subject" class="form-control" placeholder="Тема" required>
    <p id="p2"></p>
  </div>   
  <div class="form-group">
    <label for="exampleInputEmail1">Электронная почта:</label>
    <input style="background:none;" type="email" id="email" name="email" class="form-control" placeholder="Электронная почта" required>
    <p class="help-block with-errors"></p>
  </div>
  <div class="form-group">
    <label>Сообщение:</label>
    <textarea style="background:none;" name="message" class="form-control" rows="3"></textarea>
  </div>
  <input type="submit" id="sendButton" class="btn btn-default"/>
</form>

的Javascript

$('#myForm').submit(function(e) {
   e.preventDefault();
   $.ajax({
        type: 'POST',
        url: 'email.php'
   });
   $('#myForm')[0].reset();
   alert("Success!");

})

PHP

<?php

$to = 'test@mail.ru'; // Replace with your email

$subject = $_POST['subject']; // Replace with your $subject
$headers = 'From: ' . $_POST['email'];  

$message = 'Имя: ' . $_POST['firtname'] . "\n" .
           'Электронная почта: ' . $_POST['email'] . "\n" .
           'Тема: ' . $_POST['subject'] . "\n" .
           'Сообщение: ' . $_POST['message'];

mail($to, $subject, $message, $headers);

?>

Answer 1

您需要通过AJAX传递信息。并在AJAX成功时重置您的表单。你现在没有这样做。 应该是这样的：

$('#myForm').submit(function(e) {
   e.preventDefault(); 
   var firstname = $('#firstName').val();
   var subject = $('#subjectTheme').val();
   var email = $('#email').val();
   var message = $('#message').val();
   $.ajax({
        type: 'POST',
        url: 'email.php',
        data: {firstname: firstname, subject: subject, email: email, message: message },
        success: function(){
           $('#myForm')[0].reset();
           alert("Success!");
        }
   });
})

Answer 2

您需要传递表单内容并移动警报并重置为回调：

$('#myForm').on("submit",function(e) {
  e.preventDefault();
  $.post(
    $(this).attr("action"), 
    $(this).serialize(),
    function(response) { 
      alert("success");
      $('#myForm')[0].reset();
    }
  );
});

Answer 3

您的email.php文件应根据是否发送邮件向您的ajax发送状态消息。您应该将表单数据发送到email.php文件。

脚本

    $('#myForm').on("submit",function(e) {
      e.preventDefault();
 $.ajax({
        type: 'POST',
        url: 'email.php',
        data: $('#myForm').serialize(),
        success: function(data) { 
          if(data == 'success') {
              alert('mail sent success');
              $('#myForm')[0].reset();
          } else {
              alert('failed');
          }
        }
   });

您的 PHP

<?php
...
...
if(mail($to, $subject, $message, $headers)) {
    $status = 'success';
} else {
    $status = 'failed';
}
die($status);

?>