javascript - 在操作时以 HTML 形式调用 php 但不重定向

Question

我有一个 HTML 表单如下:

<form id="ContactForm" name="ContactForm" method="post" action="emailinfo.php">

然后是调用 verify() 的提交按钮:

<a href="#" class="button1" onClick="verify()">Send</a>

verify 定义如下:

function verify() {
    if(document.getElementById("name").value=="" || document.getElementById("email").value=="") {
        alert("Please enter a name and an email.");
    } else {
        alert("Looks good, sending email");
        document.getElementById('ContactForm').submit();
    }
}

目前，当我点击提交按钮时，浏览器重定向到 emailinfo.php，这只是一个空白的白屏，因为 php 文件只是发送了一封电子邮件什么都不做。如何在不重定向的情况下运行该 php 文件？

Answer 1

您要做的是在单击按钮时使用 AJAX 向 emailinfo.php 文件发送请求。将表单操作设为空白会导致表单发布到您所在的同一页面。

如果您使用的是 jQuery，则通过 ajax 提交表单非常容易:

$(document).ready( function() {
    $('.button1').click(function(){
        var f = $('#ContactForm');
        $.ajax({
          type: "POST",
          url: "emailinfo.php",
          data: f.serialize()
        });
    });
});