Javascript 使用Ajax和php与我们联系网页

我想在单击“发送”按钮时创建“联系我们”网页而不刷新该网页。我的代码如下，但存在一些问题：

1-提交表单后刷新页面

2-提交表单后，联系人表单输入的值显示在URL中

3-确认消息出现0.25秒，然后消失或不出现

4-当我使用Firefox浏览器时，我的电子邮件地址没有收到电子邮件。
请帮我解决这些问题

HTML

php

---

摆脱HTML中的内联
onclick（）
事件，让JavaScript处理单击：

$('#send').click(function(e){
    e.preventDefault();
    sendContact();
});

preventDefault（）
停止单击事件的正常运行，因此您的表单数据将在不重新加载页面的情况下提交。
您应该使用ajax完全提交表单，在表单上使用preventDefault（），这样它就不会在此页面中实际提交。您可以始终将按钮类型=“submit”更改为按钮类型=“button”OP，我想这就是你的答案。非常好，优雅的解决方案@delboy。
function sendContact() {
            jQuery.ajax({
            url: "send_email.php",
            data:'inputName='+$("#inputName").val()+'&inputEmail='+$("#inputEmail").val()+'&inputSubject='+$("#inputSubject").val()+'&textAreaMessage='+$(textAreaMessage).val(),
            type: "POST",
            success:function(data){
            $("#mail-status").html(data);
            },
            error:function (){}
            });
        }   

                <?php
                $toEmail = "*****@***.com";
                $mailHeaders = "From: " . $_POST["inputName"] . "<". $_POST["inputEmail"] .">\r\n";
                if(mail($toEmail, $_POST["inputSubject"], $_POST["textAreaMessage"], $mailHeaders)) {
                print "<div class='alert alert-success'> <button type='button' class='close' data-dismiss='alert'>&times;</button> Thank you for your email!  I will be in touch.</div>";
                } else {
                print "<div class='alert alert-danger'> <button type='button' class='close' data-dismiss='alert'>&times;</button> We are sorry, but there is a problem.  Please Make sure all fields are filled!</div>";
                }
                ?>`

$('#send').click(function(e){
    e.preventDefault();
    sendContact();
});