假设您正在发布数据，则可以使用$.post()或$.ajax()。使用 AJAX 时，最好设置一个脚本来接受提交的数据并向请求返回一些数据。最好使用JSON来实现这一点，但您也可以使用HTML。

警告

事实上，您的PHP Mail脚本很容易被滥用。没有什么可以阻止机器人滥用它，并从您的脚本或您的邮箱发送垃圾邮件。考虑添加验证码或其他方法来防止这种情况。
考虑下面的例子。它是未经测试的，但应该与一些小的PHP调整工作。

$(function() {
  $("form").submit(function(e) {
    e.preventDefault();
    $.ajax({
      url: "email.php",
      data: $("form").serialize(),
      method: "POST",
      dataType: "html",
      sucess: function(h) {
        var dlg = $("<div>").appendTo("body");
        if ($(h).hasClass("alert-success")) {
          dlg.attr("title", "Success");
        } else {
          dlg.attr("title", "Error");
        }
        dlg.html(h).dialog({
          modal: true,
          close: function() {
            $(this).remove();
          }
        });
      }
    });
  });
});

body {
  margin: 0;
  padding: 0;
  background-image: url('196-1963826_abstract-color-wallpaper-hd.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: fit;
}

.container {
  width: 500px;
  height: 650px;
  background-image: url('photo-1525847185619-02460ddde30d.jpg');
  text-align: center;
  postion: relative;
  margin-left: 30%;
  color: #ffffff;
}

h1 {
  font-size: 50px;
  margin-top: 50px;
  padding-top: 20px;
  padding-bottom: -10px;
}

h4 {
  position: relative;
  margin-top: -30px;
}

.email {
  margin-top: 100px;
  font-size: 25px;
  font-weight: bold;
}

.textholder {
  width: 50%;
  padding: 7px;
  border-radius: 30px;
  align: text-align;
}

h6 {
  font-size: 15px;
  margin-top: 3px;
  color: #00ffff;
}

.subject {
  margin-top: -05px;
  font-size: 25px;
  font-weight: bold;
}

.ftr {
  margin-top: 50px;
  font-size: 25px;
  font-weight: bold;
}

.texta {
  width: 400px;
}

.submit {
  padding: 5px;
  width: 80px;
  color: #1c8adb;
  border-radius: 20px;
  margin-top: 40px;
}

.submit:hover {
  padding: 5px;
  width: 80px;
  color: #ffffff;
  background-color: #1c8adb;
  border-radius: 20px;
  margin-top: 40px;
}

footer {
  background-color: #FFA500;
  padding: 20px;
  margin-left: -10px;
  width: 100%;
  height: 40px;
  position: relative;
  margin-top: 50px;
  margin-bottom: -10px;
}

.contact {
  float: right;
  margin-right: 15px;
  font-weight: bold;
  margin-bottom: 10px;
}

.bgrnd {
  float: left;
  margin-left: 100px;
  font-weight: bold;
}

.spnsr {
  float: left;
  margin-left: 100px;
  font-weight: bold;
  margin-bottom: 10px;
}

.imag {
  position: absolute;
  z-index: 1;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.ui-dialog {
  color: #ffffff;
  background-color: #808080;
  padding-left: 20px;
  border: 4px solid #0000ff;
}

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<div class="container">
  <header>
    <h1>Contact Us</h1>
    <h4>Send Us Your Queries</h4>
  </header>
  <form>
    <div class="email">
      <label for="email">Email-Id</label>
      <input type="email" class="textholder" id="email" name="email" placeholder="Do care to enter email">
      <h6>We'll never share your email with anyone else.</h6>
      <br> </div>
    <div class="subject">
      <label for="subject">Subject</label>
      <input type="text" class="textholder" id="subject" name="subject" placeholder="please care to enter a subject">
      <br> </div>
    <div class="ftr">
      <label for="texta">How would you like our help?</label>
      <textarea class="texta" id="content" name="content" rows="8"></textarea>
    </div>
    <input type="submit" id="submit" class="submit" value="Submit">
  </form>
</div>
<p class="imag">
  <img src="logo_S0a_2.ico" alt="logo website" width="100px" height="100px">
</p>
<footer>
  <div class="contact">
    contact us: +91 7782848946 <br> or email us at admin@gentlemensidea.com
    <br> &copy; 2020 Gentlemens' Idea, Inc. All rights reserved.
  </div>
  <div class="bgrnd">
    The image in the background belongs to its copyrighted owner and not me.
  </div>
  <div class="spnsr" link="blue">
    This site is being hosted at ecowebhosting. site hosting and ip address may change. <br> For any queries,complaints or updates related to website.. email us at <a href="https://www.gmail.com" target="_blank">admin@gentlemensidea.com</a>
  </div>
</footer>