Ajax和PHP表单：窗口仍在刷新

感谢那些读过这篇文章的人！ 我在我的网站上有一个联系人表单，我希望当用户提交它时窗口不会刷新，但它仍然会刷新，尽管我使用了带有POST方法的Ajax

以下是html代码：

                <form class="form-horizontal">
              <div class="form-group">
                <div class="col-sm-12">
                  <input type="email" class="form-control" placeholder="Email" name="email" id="email" required>
                </div>
              </div>
                <div class="form-group">
                <div class="col-sm-12">
                  <input type="text" class="form-control" placeholder="Complete name" name="name" id="name" required>
                </div>
              </div>
                <div class="form-group">
                <div class="col-sm-12">
                  <input type="text" class="form-control" placeholder="Object" name="objet" id="object" required>
                </div>
              </div>
              <div class="form-group">
                <div class="col-sm-12">
                        <textarea rows="8" class="form-control" placeholder="Your message here ..." name="message" id="message" required></textarea>
                </div>
              </div>
              <div class="form-group">
                <div class="col-sm-12">
                  <button type="submit" class="btn btn-custom-am" id="sending_form">Envoyer mail</button>
                </div>
              </div>
            </form>

---

我希望我能给你所有必要的信息

您应该防止单击事件的默认行为，即提交表单：

$('#sending_form').click(function(e){
    e.preventDefault()
    var data = {
        email: $('#email').val(),
        name: $('#name').val(),
        objet: $('#object').val(),
        message: $('#message').val()
    };
    $.ajax({
        url: "get_mail.php",
        type: 'POST',
        data: data,
        success: function(msg) {
            alert('Email sent');
        }
    });
});

节点：在函数参数中添加的e变量

---

如果不这样做-浏览器将执行的默认操作是提交表单，这是您要防止的。

您应该防止单击事件的默认行为，即提交表单：

$('#sending_form').click(function(e){
    e.preventDefault()
    var data = {
        email: $('#email').val(),
        name: $('#name').val(),
        objet: $('#object').val(),
        message: $('#message').val()
    };
    $.ajax({
        url: "get_mail.php",
        type: 'POST',
        data: data,
        success: function(msg) {
            alert('Email sent');
        }
    });
});

节点：在函数参数中添加的e变量

如果您不这样做-浏览器将执行的默认操作是提交表单，这是您要防止的

我还有最后一个问题，你知道为什么我没有任何回应吗？我在提交表单时没有看到警报，那是在ajax调用的success属性中

看来你拼错了“成功”，应该是：

 $.ajax({
        url: "get_mail.php",
        type: 'POST',
        data: data,
        success: function(msg) {
            alert('Email sent');
        }
    });

注意第二个“c”

我还有最后一个问题，你知道为什么我没有任何回应吗？我在提交表单时没有看到警报，那是在ajax调用的success属性中

看来你拼错了“成功”，应该是：

 $.ajax({
        url: "get_mail.php",
        type: 'POST',
        data: data,
        success: function(msg) {
            alert('Email sent');
        }
    });

---

注意第二个“c”。

谢谢！它的工作，我必须等待10分钟，以标记为接受你的答案，但我在等待：当然：你是受欢迎的。在你接受答案之前，你也可以投赞成票。完成！我还有最后一个问题，你知道为什么我没有任何回应吗？在提交表单时，我没有看到警告，那是在ajax调用的success属性中？可能是你的php有问题，你没有从那里得到成功返回。打开开发者工具栏，检查请求和响应。需要在ajax调用中添加错误处理，因为您永远不知道用户将在联系人表单中提交什么。谢谢！它的工作，我必须等待10分钟，以标记为接受你的答案，但我在等待：当然：你是受欢迎的。在你接受答案之前，你也可以投赞成票。完成！我还有最后一个问题，你知道为什么我没有任何回应吗？在提交表单时，我没有看到警告，那是在ajax调用的success属性中？可能是你的php有问题，你没有从那里得到成功返回。打开开发者工具栏并检查请求和响应。需要在ajax调用中添加错误处理，因为您永远不知道用户将在联系人表单中提交什么。哈哈！：那个球抓得好。有时很难发现编码中的拼写错误。哈哈！：那个球抓得好。有时很难发现编码中的拼写错误。