Ajax阻止发送表单[重复]

Question

我的 Ajax 脚本阻止发送我的表单。 我希望我的 Ajax 脚本发送我的表单，而无需刷新我的页面。 如果我在没有 Ajax 脚本的情况下使用我的表单和 PHP，它将表单发送到我的电子邮件就好了。但是当我添加 AJAX 以防止它刷新时，Ajax 脚本运行，并返回它已被发送，而不是被发送，这是我的问题。

为什么我的 AJAX 脚本阻止发送表单？

HTML：

<form id="KontaktForm" action="e_Sender.php" method="post">
Fulde navn * <input type="text" class="form-control" id="FuldeNavm" type="text" name="fuldt_navn"><br>
Email * <input type="email" class="form-control" id="Email" name="email"><br>
Mobil * <input type="number" class="form-control" id="Mobil" name="mobil"><br>
Antal * <input class="form-control" id="Antal" type="number" name="antal"><br>
Besked *<br><textarea class="form-control" id="Besked" rows="5" name="message" cols="30"></textarea><br>
<input class="btn btn-info" id="Submit" type="submit" name="submit" value="Submit">
</form>

AJAX：

$(function () {
   $("#KontaktForm").on('submit', function (e) {
      e.preventDefault();
         $.ajax({
                 type: 'post',
                 url: 'e_Sender.php',
             data: $('form').serialize(),
             success: function () {
             alert('form was submitted');
         }
      });
   });
});

PHP：

<?php 
if(isset($_POST['submit'])){
    $to = "vejby3824@gmail.com"; // this is your Email address
    $from = $_POST['email']; // this is the sender's Email address
    $fuldt_navn = $_POST['fuldt_navn'];
    $mobil = $_POST['mobil'];
    $antal = $_POST['antal'];
    $subject = $fuldt_navn . " Efterspørger et tilbud!";
    $message = $fuldt_navn . "\n" . "Mobil Nummer: " . $mobil . "\n\n" . "Kommer med: " . $antal . "\n\n" . "De har skrevet følgende besked: " . "\n" . $_POST['message'];


    mail($to,$subject,$message);
    $url = 'Index.html';
    header('Location: ' . $url);
    exit;
    }
?>

这里是network返回的图片

Answer 1

使用.serialize() 方法发送表单数据时，永远不会设置$_POST['submit']。预计JQuery behavior:

注意：只有“successful controls”被序列化为字符串。由于表单不是使用按钮提交的，因此没有序列化提交按钮的值

查看您的网络数据 - 没有 submit 字段。

修复它的最简单方法是在 PHP 端更改 if 条件：

<?php 
if (isset($_POST['email'])) {
    // ...
}